jquery ajax获取内容新增到页面上onclick无效

页面如下，且每次点击li就能够弹出li里面的内容

<
script>

 
$(function()
{

 
$("
#btn").bind('click',function()
{

 
$.post("2.html",function(result)
{

 
 
 
$("
#aaaa").append(result)

 
 
})

 
})

 
$("
#aaaa>
li").bind('click',function()
{

 
 
 
alert($(this).html())

 
})

 
})

 
<
/script>

<
input type="button" id="btn" value="点击" />

<
ul id="aaaa">

 
<
li>
www.baidu.com<
/li>

 
<
li>
www.K88.NET<
/li>
 
 

<
/ul>

我想通过点击按纽,ajax请求服务端2.html，获取的内容追加到aaaa后面

2.html的内容是

<
li>
1111<
/li>

<
li>
2222<
/li>

<
li>
3333<
/li>

<
li>
4444<
/li>

<
li>
5555<
/li>

<
li>
66666<
/li>

我希望的结果是，aaaa中追加了2.html中的内容。

我点击每个li，第一，第二个li能弹出li里面的内容（点击1，点击2），但新追加的内容不能弹出，也没有错误，新追加的li的onclick失效。

经过网上搜索了一下，找到解决办法：使用jquery on事件实现

以上的js代码改成如下

<
script>

 
$(function()
{

 
$("
#btn").bind('click',function()
{

 
$.post("2.html",function(result)
{

 
 
$("
#aaaa").append(result)

 
})

 
})

$("
#aaaa").on('click','li',function()
{

 
 
alert($(this).html())

 
})

 
})

 
<
/script>

注意：li的父级目录aaaa不能改。