如何在最后一个孩子的jquery上附加td？

Question

我创建了下面的代码：

<table id="map"> 
    <tr> 
     <td>1</td> 
     <td>2</td> 
     <td>3</td> 
    </tr> 
</table> 

<script> 
    $(document).ready(function(){ 
     $('td:last-child').mouseenter(function(){ 
      var tdId = $(this).attr('id'); 
      var newId = parseInt(tdId); 
      $(this).after('<td>new</td>'); 
     });   
    }); 
</script> 

我想创建一个新的td当鼠标放在最后孩子进入TDS。该代码正在工作。但是当我想再次创建一个新的td时，我必须徘徊在<td>3</td>上，而不是最后的td自动创建！我该如何解决这个问题？

Answer 1

使用事件代表团，而不是直接处理程序绑定到td元素：

$('#map').on('mouseenter', 'td:last-child', function(){ 
    // code here 
}); 

http://jsfiddle.net/DyTpJ/