Javascript 将jquery accordion元素从一个accordion移动到另一个accordion

这有点奇怪。我有两个jquery accordion实体，在一个accordion中单击一个项目时，我想动态地将其添加到第二个accordion中，并将其隐藏在原始中

从A移到B和从B移回A时，这都非常有效，但当我将一个项目移回原始手风琴时，任何后续从A移到B的动作都会出错

这里有一个JSFIDLE示例来说明我的意思。注意，我完全意识到代码很难看——我只是在学习这些东西。请随意提出10倍更好的方法。请执行以下操作：

• 拉小提琴
• 单击每个项目的“+”移动到手风琴2
• 所有的动作都很好

现在，请执行以下操作：

• 拉小提琴
• 单击任意“+”移动到第二个手风琴
• 在移动的项目上单击“x”，它将重新出现在第一组中
• 单击任何“+”项添加到第二组
• 手风琴项目的显示完全混乱

任何建议都将不胜感激

JSFIDLE代码是：

    $(function() {
 // create accordion entities
 $('#avAccordion').accordion({
        collapsible: true,
        autoHeight: false,
        active: false
    });
 $('#assignedAccordion').accordion({
        collapsible: true,
        autoHeight: false,
        active: false
    });
 $('.accordionAdd').click(function(){
        // destroy the accordion, prior to rebuilding
        $('#avAccordion').accordion('destroy');
        // get the h3 part and tweak it's contents
        var h3bit = $(this).parent().clone();
        $(h3bit).removeClass('freeContacts').addClass('assignedContacts');
        $(h3bit).children('span').removeClass('ui-icon-circle-plus accordionAdd').addClass('ui-icon-circle-close accordionDel');
        // get the div part after the h3
        var divbit = $(this).parent().next().clone();
        // rebuild original accordion
        $( "#avAccordion" ).accordion({
            collapsible: true,
            autoHeight: false,
            active: false
        });
        // move contents to other accordion
     $('#assignedAccordion').append(h3bit)
         .append(divbit)
         .accordion('destroy')
         .accordion({
            collapsible: true,
            autoHeight: false,
            active: false
        });
        // hide original accordion entry
        $(this).parent().hide();
        //attach click handler to new item
        $('.accordionDel').click(function(){
            dropAssignedContact(this);
            return false;
        })
        return false;
    });

    function dropAssignedContact(obj){
        // unhide right hand object with appropriate data-id attr
        var id = $(obj).parent().attr('data-id');
       // delete myself
        $(obj).parent().remove();
        // unhide original
        $('.freeContacts[data-id='+id+']').show();
        $('#assignedAccordion').accordion('destroy').accordion({
            collapsible: true,
            autoHeight: false,
            active: false
        });
    }
});

请参阅此更新的小提琴：

功能dropAssignedContact（obj）{
//使用适当的数据id属性取消隐藏右侧对象
var id=$（obj.parent（）.attr（'data-id'）；
//删除我自己
$（obj）.parent（）.next（）.remove（）；//非常简单，对我来说完全不明显！非常非常感谢，我现在可以停止把头发扯下来了。
function dropAssignedContact(obj){
    // unhide right hand object with appropriate data-id attr
    var id = $(obj).parent().attr('data-id'); 

   // delete myself
    $(obj).parent().next().remove();   // <---   Removes the adjacent div
    $(obj).parent().remove();

    // unhide original
    $('.freeContacts[data-id='+id+']').show();
    $('#assignedAccordion').accordion('destroy').accordion({
        collapsible: true,
        autoHeight: false,
        active: false
    });
 }
});