javascript中为动态生成的元素添加事件

近期在开发项目中，遇到一个问题，就是给动态生成的元素添加事件，用平常使用的方法添加不上，废话不多说，上代码：

<div id="mydiv"></div>

<script>

var html = "<div class='child'>我是动态生成的</div>"
$("#mydiv").html(html)

$(".child").on('click',function(){
    alert("哈哈哈")//触发失败
})

</script>

在上面代码中，因为异步的原因，我给动态生成的div添加点击事件，从而事件并没有触发，解决办法如下：

<div id="mydiv"></div>

<script>

var html = "<div class='child'>我是动态生成的</div>"
$("#mydiv").html(html)

$("#mydiv").on('click','.child',function(){
    alert("哈哈哈")//触发成功
})

</script>