动态添加元素的JQuery选择器

Question

我无法弄清楚如何在页面加载后选择一个动态插入DOM的元素（不是绑定处理程序）来哄骗JQuery。

例如：

如果我有HTML：

<div id="bar">
 World!
</div>

然后我创建一个新元素并将其插入DOM：

var foo = '<div id="foo">Hello</div>';
$("#bar").before(foo);

我最终得到了这个：

<div id="foo">Hello</div>
<div id="bar">
 World!
</div>

稍后我可能想要对我插入的元素做一些不同的事情，使用JQuery来操作新元素。但如果我试着这样做：

myHappyEl = $("#foo");

然后myHappyEl将是未定义的。 JQuery没有看到它，大概是因为它在DOM加载后附加了。

我已经看到很多建议解决了可能相关但又略有不同的问题，其中解决方案是使用.live（）/。on（）在元素进入时附加事件监听器。如果我想捕获点击事件或其他东西，那将是很棒的，但我没有;我希望能够选择动态添加的元素。

Answer 1

在插入元素后，您必须分配该变量，如下所示：

var myHappyEl = $("#foo"); //Nothing, it isnt there
var foo = '<div id="foo">Hello</div>';
$("#bar").before($(foo));
myHappyEl = $("#foo");

否则，页面上不存在该元素。