JQuery append au parent div

Question

Pour le code html suivant:

<div class="section grouping"> 
    <div class="sectionControl"> 
     <div class="parent row errorOn"> 
      <div class="validGroupControl"> 
       <div class="row2 itemWrap clearfix"> 
        <label>Login1 (adress e-mail)<span class="iconReq">&nbsp;</span>:</label> 
        <input type="text" class="text"> 
       </div> 
       <div class="itemWrap clearfix"> 
        <label>Input field1<span class="iconReq">&nbsp;</span>:</label> 
        <input type="password" class="text"> 
       </div> 
       <a href="#" class="iconClose" onclick="$(this).closest('div.parent').remove();" title="remove">remove</a> 
      </div> 
     </div> 
    </div> 
    <div class="row addControl"> 
     <a href="#" class="button" onclick="$('div.sectionControl').append($('div.sectionControl div.parent:last').html());">Add</a> 
    </div> 
</div> 

Je veux faire ce qui suit: cliquant sur le bouton "ajouter" prendrait <div class="parent..."> et l'ajouter à <div class="sectionControl">

Pretty much je veux de telle sorte que quand je clique sur le bouton Ajouter nouveau <div class="parent" sera ajouté sous <div class="parent..."> précédent et juste au-dessus:

     </div> 
        <div class="row addControl"> 

quand je l'essayer avec le parent() comme ceci:

alert($('div.sectionControl div.parent:last').parent().html()) 

i obtenir les doublons. Donc, au lieu d'ajouter un seul je reçois original + ce que je viens d'ajouter. Je ne suis pas sûr de savoir comment gérer cela.

merci

Answer 1

Tout d'abord, prendre ce code en ligne onclick et joindre en utilisant jQuery:

$('div.addControl a.button').click(function() { 
    var parent = $(this).closest('.section.grouping').find('.parent:last'); 
    parent.after(parent.clone()); 
}); 

Notez le '.parent:last', qui sélectionneront un des divs.