jQuery einfügen nach dem letzten Element

Question

Ich möchte Elemente nach dem letzten Element hinzufügen. Mein aktueller Code

<div class="find"><div id="FirstElement"> /*First element loaded first */ </div><div> 

$('#AddNextElement' + id).click(function (e) { 
$('<div id="NextElement' + id +'">' + /*Add after the last element*/ + '</div>').insertAfter($("#FirstElement")); 

}

Aktuelle fügt es erst nach dem ersten Element:

Ich möchte es hinzufügen nach dem letzten Element jedes Mal: ​​

Ich habe diese Links gefolgt und ich habe nicht das finden, was ich suche:

jQuery insertAfter last item

insertAfter specific element based on ID

jQuery: Add element after another element

Vielen Dank im Voraus !.

Wie ich es fest:..

$('#AddNextElement' + id).click(function (e) { 
$('<div id="NextElement"' + id +'>' + /*Add after the last element*/ + '</div>').insertAfter($("#FirstElement").parent().find('.Finder').last()); 

}

ich die .parent gefunden() finden ('finden') letzte(); dann legen Sie nach den letzten

Answer 1

Nur müssen Sie last() Methode

$('<div id="NextElement"' + id +'>' + /*Add after the last element*/ + '</div>') 
.insertAfter($('[id^="NextElement"]').last()); 

Answer 2

das letzte Element im DOM finden, in Ihrem Fall würde es NextElementxx "und dann 'nach' verwenden:

$('#NextElement2').after(..new stuff..); 

Answer 3

Wie wäre es, eine Klasse zu allen Elementen hinzuzufügen? Es wird leichter sein, die letzten zu finden:

$('.element-class:last').after('<div class="element-class" id="NextElement"' + id +'>' + /*Add after the last element*/ + '</div>'); 

Das bedeutet natürlich, dass Ihr erstes Element auch die Klasse haben muss:

<div class="element-class" id="FirstElement"> /*First element loaded first */ </div> 

Answer 4

einen Weg, um das letzte Element zu speichern ist.

<div id="FirstElement"> /*First element loaded first */ </div> 

var lastElement = $('#FirstElement'); 

$('#AddNextElement' + id).click(function (e) { 
    var element = $('<div id="NextElement"' + id +'>' + /*Add after the last element*/ + '</div>')); 
    element.insertAfter(lastElement); 
    lastElement = element; 
} 

Answer 5

HTML:

<div id="FirstElement"> First element loaded first </div> 

<div id="AddNextElement">Click me</div> 

JS:

var current = 0; 
$('#AddNextElement').click(function (e) { 
    var $el = (current == 0) ? $("#FirstElement") : $("#NextElement"+current); 
    current++; 
    $('<div id="NextElement' + current +'">Other element '+current+'</div>').insertAfter($el); 
}); 

Versuchen Sie, sich auf jsfiddle

Answer 6

Sie unter Code versuchen kann, wird es die neue div nach dem letzten „Next hinzufügen "div

JS-Code:

$(function(){ 
    $('#AddNextElementButton').on("click", function (e) { 
     var id = $("[id^='NextElement']").length ? $("[id^='NextElement']").length+1 : 1; 

     if($("[id^='NextElement']").length){ 
      $('<div id="NextElement'+ id +'">Add after the last element</div>').insertAfter($('[id^="NextElement"]').last()); 
     } else { 
      $('<div id="NextElement'+ id +'">Add after the last element</div>').insertAfter($('#FirstElement')); 
     } 
    }); 
});