使用jquery隐藏和移动元素

Question

我知道如何使用jquery来隐藏一个元素(在这种情况下是蓝色div中的图像),但是在点击时我还希望它重新出现在绿色div中(页面上的其他位置).当我在绿色div中点击它时,甚至可以回到蓝色div.我怎样才能做到这一点？

DEMO

$(document).ready(function(){
  $("img").click(function(){
    $(this).hide();
  });
});

Answer 1

您可以使用事件委派来简化:

$(document).ready(function(){
    $("#bottom-div").on("click","img",function(){
        $(this).appendTo("#top-div"); 
    });
    $("#top-div").on("click","img",function(){
        $(this).appendTo("#bottom-div"); 
    });
});

http://jsfiddle.net/cmfZX/4/