jquery中li元素的click事件为何不起作用
html代码:  
 <div class="searchContainer">
  <input type="text" name="txtSearch" class="search_text"/>  
  <a href="#"><img src="Images/Small_pic/08.gif" style="border:1px solid #ccc" /></a>
  <div class="completionList">
  <ul> <!--用于显示搜索关键字列表-->  
  </ul>
  </div>  
 </div>  
  
jquery代码：
$(function () {
  $("input:text").keyup(function () {
  $("div.completionList ul").append("<li>animal</li>")
  });
  $("div.completionList ul li").click(function () {
  alert("ok");
  });
})

但是当写成:
$(function () {
  $("div.completionList ul").append("<li>animal</li>");

  $(".completionList ul li").click(function () {
  alert("ok");
  });
})
这样的代码就没问题, 前一个代码就有问题, 显示不出ok

本来是想实现一个类似autoComplete下拉菜单关键字搜索功能，当取得数据的时候便添加一个li元素到ul当中,但是li元素的click 事件不起作用, 点击它的时候总出不来alert 提示，不知道是哪里出了问题?

------解决方案--------------------
动态添加的元素不能想你那样绑定事件(原因我也搞不懂)！你要对添加的元素绑定事件可以这样:
$("div.completionList ul").append("<li onclick='a()'>animal</li>");
试一下吧
 
------解决方案--------------------
http://blog.csdn.net/xinhaozheng/article/details/5862109

 $("div.completionList ul li").live('click',function () {
alert("ok");
});