如何使用jquery appendTo另一个div ....并且再次返回

Question

当在div1内部单击一个项目时，它将被追加到div2的内部。 （这个效果非常好！）然后，我点击div2中的项目（希望它会返回到div1），但没有任何反应。任何想法非常受欢迎。 dom没有被更新？我的选择器是否正确？

<div id="div1"> 
<div class="items">Audi</div> 
<div class="items">Jeep</div> 
<div class="items">Mini</div> 
</div> 

<div id="div2"></div> 

$('#div1 .items').click(function(){ 
    $(this).appendTo("#div2"); 
}); 


$('#div2 .items').click(function(){ 
    $(this).appendTo("#div1"); 
}); 

Answer 1

试试这个。

$(document).ready(function(){ 
 
    
 
$(function(){ 
 
    $("#div1").on("click", ".items", function(){ 
 
    $("#div2").append($(this)); 
 
    }); 
 
    }); 
 
    
 
    $(function(){ 
 
    $("#div2").on("click", ".items", function(){ 
 
    $("#div1").append($(this)); 
 
    }); 
 
    }); 
 
});

div{ 
 
    display: block; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script> 
 

 
<div id="div1"> 
 
    <h2>Div 1</h2> 
 
    <div class="items">Audi</div> 
 
    <div class="items">Jeep</div> 
 
    <div class="items">Mini</div> 
 
</div> 
 

 
<div id="div2"> 
 
    <h2>Div 2</h2> 
 
</div>