SOURCE

///*
$(".list-item").on("click", function(){
	alert("点击了li");
})
//*/

$(".btn").on("click", function(){
  $(".list").prepend("<li class='list-item'>这是新增li</li>");
})

//事件代理
/*
$(".list").on("click", ".list-item", function(){
  alert("点击了li");
})
*/

<a href="javascript:void(0)" class="btn">添加li</a>

<ul class="list">
	  <li class="list-item">这是li</li>
    <li class="list-item">这是li</li>
  	<li class="list-item">这是li</li>
    <!--这里是100个li -->
</ul>

.list{
  padding:0;
  margin:0;
}
.list-item{
  list-style:none;
  line-height:40px;
  border-bottom:1px solid #ccc;
}
.list-item:hover{
  background-color:#ccc;
}
.btn{
  width:100px;
  text-align:center;
  display:block;
  background:green;
  color:white;
  padding:10px;
  text-decoration:none;
  margin:20px 0;
}