Fehler beim Duplizieren eines div

Question

Ich bin neu in Javascript und jQuery und ich versuche, das "Person [1]" Div innerhalb der "peopleID" div mit dem Klicken der Schaltfläche so oft wie nötig klonen und ich kann Es scheint mir nicht klar zu sein, was ich falsch gemacht habe.

jsfiddle

Javascript

$(document).ready(function() { 
    $('#add').click(function() { 
    var clonedDiv = $('#Person[1]').clone(); 
    $('#peopleID').after(clonedDiv); 
    }); 
}); 

HTML-Code

<form> 
    <input id="add" value="Add Additional Field" type="button"> 
    <div id="peopleID"> 
    <div id="Person[1]"> 
     <select name="Personnel[1]"> 
     <option value="1">Option 1</option> 
     <option value="2">Option 2</option> 
     </select> 
    </div> 
    </div> 
</form> 

Answer 1

Sie müssen escape square bracket in selector, da sie eine besondere Bedeutung in selectors sonst hat, ist es für ein Element mit id suchen Person und hat Attribut 1 seit eckigen Klammer alshandeln 210.

$('#Person\\[1\\]').clone(); 

---

Oder Sie attribute equals selector als Alternative verwenden können.

$('[id="Person[1]"]').clone();