JQuery动态元素事件绑定问题

最近做了一个H5的页面，发现在IOS设备上点击没任何反应。后来调试发现，在H5页面上的元素是通过js动态添加的，而点击事件用的动态元素id的live事件。
后来查找资料发现，JQuery在1.9版本之后删除了对live事件的支持，改用on事件。
但是使用on事件的时候，需要特别注意：
如果是动态添加的元素，不能直接用该对象操作on事件，否则会没反应。只能选择其非动态生成的父元素再找到该元素才能触发on事件。

比如：

<ul id='ulId'></ul>

然后通过jQuery动态添加一部分li元素到该ul下

<ul id='ulId'>
<li>xx</li>
<li>yyy</li>
</ul>

此时如果直接用li元素的on事件，是没反应的

$('li').on('click', function(){alert('xx');})

只能通过如下的方式让on生效

$('#ulId').on('click','li', function(){alert('xx');})