jquery insertAfter（）也插入克隆

Question

我在我的js脚本中发生了一件奇怪的事情。

当执行点击功能，一个元件应该被插入下面另一个，但由于某些原因，元件克隆插入有作为。

怎么回事？克隆发生在点击功能之外。

请帮我理解发生了什么。

http://jsbin.com/unenil/1/edit

$("button").click(function() { 
    $(".one").insertAfter(".two"); 
    $(".status").text("done"); 
}); 


var clone_one = $(".one").clone(); 
var clone_two = $(".two").clone(); 
$("body").append(clone_one); 
$("body").append(clone_two); 

基本上，我不明白为什么在这种情况下，点击功能有什么用这需要它的地方以外的克隆。

Answer 1

克隆的元素有one类，所以他的克隆也是。因此，$(".one")包含克隆和克隆。

一个解决方案是保留原来的元素的引用，并插入：

var original = $(".one"); 
var clone_one = original.clone(); 
var clone_two = $(".two").clone(); 
$("body").append(clone_one); 
$("body").append(clone_two); 

$("button").click(function() { 
    original.insertAfter(".two"); 
    $(".status").text("done"); 
});