javascript - innerHTML不循环表

现在，我的Web应用程序中有一个表：

<tr class="inner2-top">
</tr>

通过遍历Web数据库中的元素并相应地添加该数据来填充表的数据。

      for (var i = 0; i < results.length; i++) {
      var object = results[i];
        (function($) {
        $('.inner2-top').append('<tr><td class="name1"><a href="#">'+
              object.get('username') + '</a></td><td class="company1">' +
              object.get('dot') + '</td><td>');
      })(jQuery);
    }

然后，我在弹出窗口中显示表中的用户名。

        $(document).on('click', '.name1 a', function(e){
        $('#para').html($('td.name1').html());
            $('.popup1').lightbox_me({
    });

我注意到的是，弹出窗口仅显示表中第一项的名称，而不显示第二项的名称。例如，假设表的结构如下：

第1行：安东尼

第2行：大卫

当我选择第1行时，Anthony会显示在弹出窗口中。

当我选择第2行时，Anthony也会显示在弹出窗口中。

任何想法为什么会这样？

最佳答案

尝试在调用html函数时将其包含在函数中

$(document).on('click', '.name1 a', function(e){
    $('#para').html($(this).html());
        $('.popup1').lightbox_me({
});

JSFIddle