对于动态添加的元素，我们想给它添加一个事件，但是发现通过$(选择器)无法获取到该元素
可以通过下面这种方法获取
$(body).on('事件名称','选择器',callback);
案例如下：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>jquery给动态元素添加点击事件</title>
</head>
<body>
<div class="box"></div>
<button>动态添加元素</button>
<script src="https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js">
</script>
<script>
//点击按钮动态添加元素到box这个div中
$('button').click(function(){
$('.box').append("<div class='new'>这是新添加的内容</div>");
});
//给动态添加的元素(class='new'的div)添加点击事件
$("body").on("click",".new",function(){
alert($(this).html());
});
</script>
</body>
</html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>jquery给动态元素添加点击事件</title>
</head>
<body>
<div class="box"></div>
<button>动态添加元素</button>
<script src="https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js">
</script>
<script>
//点击按钮动态添加元素到box这个div中
$('button').click(function(){
$('.box').append("<div class='new'>这是新添加的内容</div>");
});
//给动态添加的元素(class='new'的div)添加点击事件
$("body").on("click",".new",function(){
alert($(this).html());
});
</script>
</body>
</html>
