jquery clone div et l'ajoute après un div spécifique

Question

À partir de l'image ci-dessus, je souhaite cloner le div avec l'id #car2 et l'ajouter après le dernier div avec l'id start with car, dans cet exemple id #car5. Comment puis je faire ça? Merci.

Voici mon code d'essai :

 $("div[id^='car']:last").after('put the clone div here');

Answer 1

Vous pouvez utiliser clone, puis comme chaque div a une classe car_well, vous pouvez utiliser insertAfter pour insérer après le dernier div.

 $("#car2").clone().insertAfter("div.car_well:last");

Answer 2

essaye ça

 $("div[id^='car']:last").after($('#car2').clone());

Answer 3

Cela fonctionne très bien si une copie directe est en ordre. Si la situation nécessite la création de nouveaux objets à partir de modèles, j'enveloppe généralement le modèle div dans un div de stockage caché et j'utilise le html() de jquery en conjonction avec clone() en appliquant la technique suivante :

 <style>
#element-storage {
    display: none;
    top: 0;
    right: 0;
    position: fixed;
    width: 0;
    height: 0;
}
</style>

<script>
$("#new-div").append($("#template").clone().html(function(index, oldHTML){ 
    // .. code to modify template, e.g. below:
    var newHTML = "";
    newHTML = oldHTML.replace("[firstname]", "Tom");
    newHTML = newHTML.replace("[lastname]", "Smith");
    // newHTML = newHTML.replace(/[Example Replace String]/g, "Replacement"); // regex for global replace
    return newHTML;
}));
</script>

<div id="element-storage">
  <div id="template">
    <p>Hello [firstname] [lastname]</p>
  </div>
</div>

<div id="new-div">

</div>