jquery append 动态添加的元素绑定事件on

用jquery添加新元素很容易，面对jquery append 动态添加的元素事件on 不起作用我们该如何解决呢？on方法中要先找到原选择器（如例.info),再找到动态添加的选择器（如列.delete)。

具体不多说了，请看下面的代码吧。

 1 <!DOCTYPE html">
 2 <html>
 3 <head>
 4     <meta charset=UTF-8">
 5     <title>测试</title>
 6     <script type="text/javascript"
 7             src="js/jquery.js"></script>
 8     <script type="text/javascript">
 9         $(function(){
10 //动态添加
11             $(".add").on("click",function(){
12                 console.log("进来了");
13                 $(".info").append('<div class="delete"><h3>单击我来删除我</h3></div>');
14             });
15             //对动态添加的元素添加事件-删除
16             $(".info").on("click",".delete",function(){
17                 console.log("进来了Delete！");
18                 $(this).remove();
19             });
20         });
21     </script>
22 </head>
23 <body>
24 <h2 class='add'>单击我添加动态元素</h2>
25 <div class="info"></div>
26 </body>
27 </html>