Как увеличить число и отображение динамически добавленного div jquery?

Question

У меня есть ссылка поверх статического div, которая по умолчанию загружается (Div number 1).

Как показано на рисунке, всякий раз, когда я нажимаю на гиперссылку, div добавляется под каждым последним div, что я сделал очень хорошо. Я хочу сделать это, как вы можете видеть на картинке, мне нужно увеличить количество чисел div, таких как 2, 3, 4, и текст под названием «Div number ...» на динамически добавленных div.

Как я могу добиться этого с помощью JQuery?

Answer 1

Это довольно просто. Просто добавьте новые div.

(function(){ 
    var div = 0; 
    $(".create").click(function(){ 
    div++; 
    $(".block").append('<div class="new_div">Div number '+div+'</div>'); 
    }); 
})(); 

В ДЕМО: Click here

Answer 2

Предполагая, что вы помещаете div в контейнер «контейнер».

код добавления приращения div no is.

var no = $('div','#contianer').length; // will give you total no of div in that container. 
var incno = parseInt(no,10)+1; 

Answer 3

может быть, мой псевдокод дает представление

$('#linktoadd').click(function(){ 
    $('#divholder').append('<div class="foo">Div Number'+($('#divholder div').length +1) +'</div>'); 
} 

Answer 4

Попробуйте DEMO

HTML

<div> 
    <a id="lnk" href="#">Link to add more divs</a> 
</div> 

SCRIPT

var count = 1; 
$("#lnk").click(function() { 
    $(this).parent().append('<div class="divStyle">Div number ' + count + ' </div>'); 
    count++; 
}); 

CSS

.divStyle { 
    background-color:gray; 
    margin-bottom:2px; 
    }