Добавление новой строки в таблицу HTML динамически с помощью JScript

Я пишу код в HTML + Jquery и вам нужно динамически добавлять строки в таблицу.

Я написал код для динамического добавления строк, но он, похоже, не работает.

Вот мой код JScript:

<script language="JavaScript">
        function addRow(tableID) {
            var table = document.getElementById(tableID);

            var rowCount = table.rows.length;
            var row = table.insertRow(rowCount);

            var cell1 = row.insertCell(0);
            var element1 = document.createElement("input");
            element1.type = "date";
            element1.name="datebox[];
            element1.id = "dt";
            cell1.appendChild(element1);

            var cell2 = row.insertCell(1);
            cell2.innerHTML = rowCount + 1;
            var element2 = document.createElement("input");
            element2.type = "select";
            element2.name = "selectbox[]";
            element2.id = "slct";
            cell2.appendChild(element2);

            var cell3 = row.insertCell(2);
            cell3.innerHTML = rowCount + 1;
            var element3 = document.createElement("input");
            element3.type = "text";
            element3.name = "txtbox[]";
            element3.id = "txt";
            cell3.appendChild(element3);
            table.appendChild(cell1);
        }
    </script>

Это моя таблица:

<table id = "tab" style="width:500px">
    <tr>
        <th>Date</th>
        <th>Treatment Goal</th>
        <th>Comment</th>
    </tr>
    <tr>
        <td><INPUT type="date" name="datebox[]" id = "dt"/></td>
        <td>
            <SELECT name="selectbox[]" id = "slct">
            </SELECT>
        </td>
        <td><INPUT type="text" name="txtbox[]" id = "txt"/></td>
    </tr>
</table>

Я вызываю функцию в событии onClick такой кнопки:

<input type="button" id="add" value="+" name="Add" onclick="addRow('tab')"/>

Страница html не отвечает на событие click, и ничего не происходит. Не понимаю, что происходит.