我在学习ajax数据到元素的时候，发现由ajax添加的数据无法被点击事件响应。请问我该如何解决？

因为你添加的ajax数据在js执行之后，也就是说$('.test').click这个方法在js执行之后没有被绑定在click上面。这个时候需要动态绑定，把事件绑定在js执行完成之前就存在的元素上面，例如下面的例子我绑定在table上面，然后用on()来绑定click，on其实可以接受三个参数，如果第二个是字符串的话，就是动态绑定的元素。

<table id="table">

<tr>

<td>11111</td>

</tr>

</table>

<script>

setTimeout(function() {

$('#table').append('<tr><td class="test" id="12">id12</tr><tr><td class="test" id="13">id13</tr><tr><td class="test" id="14">id14</tr>')

}, 1000)

$('#table').on('click', 'td.test', function() {

var test_id = $(this).attr('id')

console.log(test_id)

})

</script>

失效的原因是你仅在页面加载时对元素进行处理，但通过ajax加载的新元素没做处理。

如果你仅需要改变样式，可以在css中通过选择器来实现，如

.first:hover {

    color:red

}

如果你还需要对其进行其他处理，则需要在ajax的callback中对新加载的元素进行处理，如添加事件等

---