jQuery将div加载到另一个没有.html（）方法的文件中

Question

我有一个要显示在另一个div（食物）中的div（我们称其为土豆）。 这样做的典型方法是：

$("#food").html ( $("#potatoes").html()); 

但是，这并没有实现我想要的。 jQuery似乎没有使用实际的“ potatoes” div，而是将内容复制到food div，而原始内容仍然存在于浏览器中。

我希望ACTUAL div（土豆）从其位置消失并出现在容器div（食物）中，而不必执行.hide（）...或类似方法。

原因？ 我在选择器中启用和禁用了土豆div中的按钮，它们似乎触发了原始土豆div的内容，但没有触发已加载到food div中的重复项。

那有意义吗？ 谁能提供这方面的原因以及我应该怎么做的见解？

边注：

$(document).on('click','#button-loaded-with-page', {} ,function(e){
    this.disabled = true;
    $('#button-inside-potatoes-div').hide();
});

上面的示例是我想要实现的，但是当.html()方法将土豆中的内容加载到食物中时，则不会隐藏按钮。 而是隐藏页面上的原始按钮，而不是重复的按钮。

我正在尝试实现的目标： https ： //jsfiddle.net/o9kshscj/6/

Answer 1

您可以将对象传递给html（）

$("#a").html($("#b"));

演示： 小提琴

Answer 2

您可以使用append更改父项。 这将移动 #potatoes对象出它的当前位置DOM，到#food DIV作为一个孩子

$("#food").append($("#potatoes"));

Answer 3

您可以像这样替换后删除div：

$("#a").html($("#b").html());
$("#b").remove();
$("#button-to-enable").prop("disabled", false);