一直觉得自己对事件委托理解的挺深刻，今天遇到的场景，翻遍了各种资料也没有找到答案，才加深了对事件委托的进一步理解。
事情是这样的....（需求是这样的）
一 应用场景
有一个ul，点击一个按钮，动态的添加li，li里面有两个div，这两个div都有一个事件。但是div1得先触发，div2才显示出来，然后点击div2，div2消失。需求听起来很简单，coding如下：
然后愉快的点击Add，先添加了几组li，效果如下：
紧接着点击第一个AAAA,效果也正常，AAAA后面那个div的hide显示出来了，如下:
然后，再点击hide，没反应！！！
二 分析原因
看了下自己写的代码，觉得没问题啊，aa和bb都把事件委托给了共同的父类ul,没毛病啊。
然后就一通搜索，发现度娘上根本没有这个问题，关键词找遍了反正是.....
最后不得已，才仔细的琢磨这段代码，发现了一个惊人的秘密！同一个父元素被委托了相同的click事件！我的神呀，他也就是个程序语言，会被我混乱的思维搞坏的，委托了相同的click事件，那谁能告诉它监听到这个事件后到底应该做什么？所以，不同的浏览器会根据不同的规则进行操作。有的会先来的先委托，直接舍弃第二个委托事件，就是本例中的现象。我还把代码跑在浏览器中，发现第二个直接覆盖了第一个，连点击第一下的时候hide都出不来。
三 来，一起修改一下
搞清楚了原因，那我们就要避免这种写法，让第一个委托事件被点击后再添加第二个,并且在添加第二个之前把第一个事件委托取消。同理，在第二个事件委托后再调用添加第一个，并在第一个事件委托前清除第二个事件委托。具体代码如下。
以上就是关于事件委托踩的一个坑，感觉最终的实现不是特别优雅，后续有长进了会再来补充...