javascript – 动态添加的HTML不被jQuery识别

在这里阅读其他一些事情：这个类似的问题,但我不确定如何将这应用于我的困境.

我有一个jquery函数替换列表中的一些HTML ..
例如,在函数运行之前：

<ul id="mylist">
<li id="item1">blah blah blah</li>
<li id="item2">blah blah blah</li>
<li id="item3">blah blah blah</li>
</ul>

然后我有另一个点击LI的运行,例如：

$("#mylist li").click(function () {
alert($(this).attr("id"));
});

工作正常,直到我动态修改#mylist html,警报为空.

如何替换#mylist html并仍然可以选择里面的li？

解决方法

要在所有未来动态添加的列表项上维护此功能,您应该使用$.on()的事件委派：

$("#mylist").on("click","li",function(){
  alert( this.id );
});

在http://api.jquery.com/on/在线阅读更多关于$.on()的信息.