Pourquoi ne pas jQuery Append travail pour la fin des éléments de liste HTML?

Question

Je suis en train de cloner un élément de la liste, puis ajoutez au bas de cet élément de liste cloné, notez qu'il doit être inférieur à l'élément de liste étant cloné, pas au bas de la liste que je peux le faire moi même. L'objectif est de l'utiliser avec jQuery.ui sortable.

Tout fonctionne très bien, en fait, je peux même obtenir le clonage et le droit annexant. Cependant, il l'ajoute avant la balise </li> de fermeture, et pour la vie de moi je ne peux pas le forcer à ajouter après cette balise.

Ceci est le balisage HTML:

<ul id="column-2" class="connectedSortable">
    <li class="ui-state-default">
        <div class="label">feature</div>
        <div class="action">
            <div class="delete"></div>
            <div class="other"></div>
        </div>
    </li>
</ul>

La partie qui nous intéresse est class="other" qui après avoir été cliqué sur dupliqueront l'élément de liste.

Ceci est le jQuery jusqu'à présent:

// This works fine
$(".other").click(function() {

    // This needs to be set (global) to be used later on in some future code.
    actionTarget = this;        

    // This grabs the whole list item
    var targetStory = $(actionTarget).parent().parent();

    // This clones the list item, as well as appending 
    // that clone to the cloned list item
    $(targetStory).clone().appendTo(targetStory);

})

Cela fonctionne bien, il saisit l'élément de liste, des clones, alors il déverse sur l'écran - mais au mauvais endroit: (

<ul id="column-2" class="connectedSortable">
    <li class="ui-state-default">
        <div class="label">feature</div>
        <div class="action">
            <div class="delete"></div>
            <div class="other"></div>
        </div>
        <li class="ui-state-default">
            <div class="label">feature</div>
            <div class="action">
                <div class="delete"></div>
                <div class="other"></div>
            </div>
        </li>
    </li>
</ul>

Quelqu'un a une idée pourquoi il n'annexant à la fin de l'élément de liste cloné, et comment résoudre ce problème?

Answer 1

peut-être que vous voulez utiliser après au lieu de appendTo

Answer 2

Je pense que ce que vous voulez est le suivant:

$(targetStory).clone().appendTo(targetStory.parent());

Answer 3

Je pense que insertAfter est ce que vous cherchez. après insérerait le nœud d'origine après le clone, plutôt que le clone après le nœud d'origine. Quelque chose comme cela devrait fonctionner:

$(targetStory).clone().inserAfter(targetStory);