JQuery добавить класс встроить элемент

Question

Я пытаюсь добавить класс к элементу вставлять так:

$(".single-floorplan embed#2").addClass("activeFloorplan"); 

Однако это не работает, класс не добавляется, я даже пытался

$(".single-floorplan #2").addClass("activeFloorplan"); 

все еще ничего, класс не добавляется.

Здесь находится объект embed.

<embed src="~/PDFs/floorplans/pdf.pdf" height="500" type='application/pdf' id="2"> 

Как добавить класс для вставки элемента.

Встраиваемый элемент обернут внутри класса, называемого одноэтажным планом.

Answer 1

Я думаю, вы пытались

$(".single-floorplan embed#2").addClass("activeFloorplan"); 

перед тем embed object помещается в документе.

Так что не забудьте разместить код js после этого embed объект размещен.

Answer 2

В очень грубой идеей, вы можете попробовать следующее:

SetTimeout (функция() {. $ ("Сингл-# 2 планировка ") addClass (" activeFloorplan");}, 5000);

Answer 3

1. Попробуйте $('#2').addClass('activeFloorplan')
2. Используйте IFRAME.
3. Детали находятся в фрагменте.

Если вы используете WordPress, а CMS, или какой-либо другой тип установки куки резака, результаты будут очень (очень очень).

SNIPPET

$('#1').addClass('activeFloorplan'); 
 
$('#2').addClass('activeFloorplan'); 
 
$('#3').addClass('activeFloorplan');

body { 
 
    font: 400 12px/1.4 Verdana 
 
} 
 
#a2 { 
 
    border: 5px solid #0e0 
 
} 
 
#a3 { 
 
    border: 5px solid #e00 
 
} 
 
.activeFloorplan { 
 
    outline: 10px dashed #930; 
 
} 
 
.g { 
 
    color: green; 
 
} 
 
.b { 
 
    color: blue; 
 
} 
 
.r { 
 
    color: red; 
 
} 
 
div p { 
 
    font-size: 14px; 
 
    background: #fc1 
 
} 
 
code { 
 
    background: #05f; 
 
    color: #efe; 
 
    padding: 1px 2px; 
 
} 
 
.scroll { 
 
    font-size: 20px; 
 
    text-align: center; 
 
} 
 
.tip { 
 
    border: 2px solid tomato; 
 
    border-radius: 40%; 
 
    line-height: 3; 
 
    width:50%; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class='scroll'>▼▼▼Scroll▼▼▼</div> 
 
<p>All nodes with the class <code>.activeFloorplan</code> have a brown dashed outline. This indicates that each time <code>.addClass()</code> was applied directly to a node's <code>id</code>, it was successful. So if there's an <code>id</code> on our target node...just 
 
    select the <code>id</code>.</p> 
 
<p class='tip'>Use <code>$('#2').addClas('activeFloorplan')</code> 
 
</p> 
 
<p class='g tip'>Try an &lt;iframe&gt; for PDFs</p> 
 
<p class='b'>&lt;embed&gt; is good for SVG</p> 
 
<p class='r'>&lt;embed&gt; is not good for PDF</p> 
 
<p>If the &lt;iframe&gt; doesn't work...check the location of said PDF.</p> 
 
<div id='al'> 
 
    <div class='scroll'>▼▼▼Scroll▼▼▼</div> 
 
    <p>This is a PDF within an &lt;iframe&gt;</p> 
 
    <iframe id="1" src="http://www.gtupw.org/articles/attachments/1358398740.pdf" frameborder='5' width='500'></iframe> 
 
</div> 
 
<div class='scroll'>▼▼▼Scroll▼▼▼</div> 
 
<div id='a2'> 
 
    <p>This is a SVG within an &lt;embed&gt;</p> 
 
    <embed id="2" src="https://upload.wikimedia.org/wikipedia/commons/9/99/Compass_rose_simple.svg"> 
 
</div> 
 
<div class='scroll'>▼▼▼Scroll▼▼▼</div> 
 
<div id='a3'> 
 
    <p>This is a PDF within an &lt;embed&gt;</p> 
 
    <embed id="3" src="http://www.gtupw.org/articles/attachments/1358398740.pdf"> 
 
</div> 
 
<div class='scroll'>✲✲✲END✲✲✲</div>