Warum jQuery nicht Arbeit anhängen für das Ende der HTML-Listenelemente?

Question

Ich versuche, ein Listenelement zu klonen, und es dann auf den Boden des geklonten Listenelement anhängen, beachten Sie, dass es unter dem Listeneintrag wird geklont, nicht am Ende der Liste sein sollte, wie ich tun kann, dass mich selber. Der Zweck ist es mit jQuery.ui sortierbar zu verwenden.

Alles funktioniert gut, in der Tat habe ich sogar das Klonen erhalten und das Anhängen von rechts. Aber es hängt es vor das Schließen </li>-Tag und für das Leben von mir, ich kann es nicht anhänge zwingen nach diesem Tag.

Dies ist der HTML-Code:

<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>

Der Teil, den wir mit den betroffenen sind, ist class="other" die auf angeklickt auf das Listenelement duplizieren.

Dies ist die jQuery so weit:

// 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);

})

Das funktioniert gut, packt sie das Listenelement, Klone es, dann gibt sie auf dem Bildschirm - aber an der falschen Stelle: (

<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>

Wer noch keine Ahnung, warum es nicht bis zum Ende des Listenelementes anhängt geklont, und wie diese zu lösen?

Answer 1

Vielleicht möchten Sie verwenden nach statt appendTo

Answer 2

Ich denke, was Sie wollen, ist dies:

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

Answer 3

Ich denke, insert ist das, was Sie suchen. nach würde den ursprünglichen Knoten nach dem Klon einzufügen, anstatt der Klon nach dem ursprünglichen Knoten. So etwas sollte funktionieren:

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