动态添加元素的JQuery选择器

我无法弄清楚如何同步JQuery来选择在页面加载后动态插入到DOM中的元素(不绑定处理程序)。

例如：

如果我有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()来附加一个事件监听器当元素进入时。如果我想要捕获点击事件或某些东西，那将是辉煌的，但我不会;我想要能够选择动态添加的元素。

解决方法

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

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

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