Добавление скрытого div в динамически созданный div

Question

Я новичок в jQuery и возился с попыткой добавить новые элементы в DOM после того, как новый узел был вставлен в DOM.

Предположим, у меня есть опрос. После того, как пользователь проголосует, новый div с классом .voted вставляется в div, который содержит опрос. Если бы у меня был скрытый div, который я хотел бы вставить и показать только тогда, когда этот новый div был добавлен в DOM, возможно ли это?

Я делал исследование на сайте JQuery и до сих пор, ближайший я придумал что-то вроде этого:

$('.hidden-div').livequery(function() { 
    appendTo('.voted'); 
}); 

Я попробовал это на моем сайте, но, как и ожидалось, Ждут» т работы. Есть ли способ достичь этого с помощью jQuery?

Edit: Вот упрощенная версия разметки:

Перед пользователем Проголосовало:

<div id="poll"> 
    (poll here) 
</div> 
<div id="hidden-div" style="display:none">content</div> 

После пользователь проголосовал:

<div id="poll"> 
    <div class="voted"> 
     (some content here)        <-- in here----------| 
    </div>                 | 
</div>                  | 
<div id="hidden-div" style="display:none">content</div> <-- I want this div..| 

Answer 1

Вы можете использовать append():

var html = '<div id="hidden-div">content</div>'; 
$('.append').click(function() { 
    $('.voted').append(html); 
}); 

Я сменил триггер на клик для демонстрационных целей, но триггер может быть тем, что вам нужно. Содержимое будет размещено в пределах voted div.

JS Fiddle Demo

Обратите внимание, что это будет постоянно добавлять HTML-код по щелчку. Для того, чтобы заблокировать его от прилагаемых несколько раз, используйте .length который подсчитывает количество элементов, присутствующее на странице:

$('.append').click(function() { 
    if($('#hidden-div').length == 0){ 
     $('.voted').append(html); 
    } 
});