Динамически добавлять строки в нескольких таблицах на одной странице, используя одну функцию

Question

У меня есть несколько таблиц, и у меня есть функция, которая добавляет строки в эти таблицы:

<table id="table1" style=" border-collapse: collapse;">
<tr id="table1row1">...
<tr id="table1row2">...
<table id="table2" style=" border-collapse: collapse;">
<tr id="table2row1">...
    <tr id="table2row2">...

Проблема в том, что когда я добавляю строки вместо того, чтобы давать результат выше, у меня будут такие результаты:

<table id="table1" style=" border-collapse: collapse;">
<tr id="table1row1">...
<tr id="table1row2">...
<table id="table2" style=" border-collapse: collapse;">
<tr id="table2row1">...
<tr id="table2row3">...

когда я вызываю функцию для добавления строки в другую таблицу, она просто увеличивает значение

var thischannel=1;
var thisassignment=1;
var thisrow=1;  
function addRow(list,table){

    thisrow++;

    if(something to place in this to point if this is a new table or the same table){
    var thisrow=1;  
    }
}

Answer 1

Я бы применил одно и то же имя класса ко всем таблицам и ссылался бы на них в jQuery следующим образом:

$(".className").append($("<tr><td>Hello World!</td></tr>"));

Если вы хотите использовать идентификаторы, вы можете сделать это следующим образом:

$("#table1, #table2").append("<tr><td>Hello World!</td></tr>"));

Answer 2

Вместо того, чтобы хранить количество строк в переменной, просто выясните, сколько строк в таблице, и используйте это число для создания идентификатора

var numRows = $(tableID).find("tr").size();
var id = tableID + "row" + (numRows + 1);

Полный пример: http://jsfiddle.net/HK6bA/