JQuery итерации через вновь созданные элементы

Question

Я пытаюсь добавить новые строки в мою таблицу и сохранить их в БД.

Сначала я использую .append () для добавления строк в таблицу:

$("#tablename").append("<tr id='newRow'><td>newly added row</td></tr>");

Функция добавления работает нормально. Моя страница отображает правильный результат.

Однако я не могу выбрать их с помощью

$("#newRow").each(function () { alert "it never reaches here!"; });

Я предполагаю, что это потому, что элементы добавляются после загрузки DOM. Может кто-нибудь сказать мне, как я могу перебрать все мои недавно добавленные элементы?

Спасибо.

Answer 1

Вы должны использовать class для этого случая, идентификатор должен быть незаполненным (это недопустимый HTML и в противном случае будет немного странно), например:

Answer 2

Метод Ника работает просто отлично, вот еще один:

$(function(){
  //add a class to mark the last row on load
  $('#tableName tr:last').addClass('lastRow');

  // ...

  // select new rows when you click save
  $('input:submit').click(function(){
     $('#tableName tr.lastRow').nextAll().each(function(){
        alert('added row');
     });
  });
});

Answer 3

Если все, что вам нужно, это зациклить новые строки, вы можете сделать это:

var rows = $("<tr class='newRow'><td>newly added row</td></tr>").appendTo('#tablename');
rows.each(function () { alert "it never reaches here!"; });