jQuery가 HTML 목록 항목의 끝에 작동하지 않는 이유는 무엇입니까?

Question

나는 목록 항목을 복제하려고 시도한 다음 복제 된 목록 항목의 맨 아래에 추가하려고합니다. 내가 직접 할 수 있으므로 목록의 맨 아래가 아니라 클로닝되는 목록 항목 아래에 있어야합니다. 목적은 jQuery.ui 정렬 가능한 사용으로 사용하는 것입니다.

모든 것이 잘 작동합니다. 사실 나는 복제와 부여를 얻을 수도 있습니다. 그러나 추가합니다 ~ 전에 마감 </li> 태그, 그리고 내 삶을 위해 나는 그것을 덧붙이도록 강요 할 수 없습니다. ~ 후에 이 태그.

이것은 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>

우리가 관심있는 부분은 IS입니다 class="other" 클릭하면 목록 항목이 복제됩니다.

이것은 지금까지 jQuery입니다.

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

})

이것은 잘 작동하고 목록 항목을 잡고 복제 한 다음 화면에 버립니다. 그러나 잘못된 장소에 :(

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

누구든지 왜 그것이 클로닝되는 목록 항목의 끝에 추가되지 않는지, 그리고 이것을 해결하는 방법은 무엇입니까?

Answer 1

아마도 당신은 사용하고 싶을 것입니다 ~ 후에 Appendto 대신

Answer 2

나는 당신이 원하는 것이 이것이라고 생각합니다.

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

Answer 3

제 생각에는 삽입자 당신이 찾고있는 것입니다. 후 원래 노드 후 클론이 아니라 클론 후 원래 노드를 삽입 한 후. 이와 같은 것이 효과가 있어야합니다.

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