Добавить кнопку Дополнительно, чтобы добавить строку в нижней части таблицы

Question

У меня есть таблица вроде этого:

<table id="myTable" border="1"> 
    <tbody> 
    <tr><td>Name</td></tr> 
    <tr><td><input name="field-1" type="text" /></td></tr> 
    <tr><td><input name="field-2" type="text" /></td></tr> 
    </tbody> 
</table> 

Я хочу добавить больше кнопки, поэтому каждый раз, когда мы нажимаем ADD MORE кнопку добавляет новую строку с уникальное имя пользователя

<tr><td><input name="field-3" type="text" /></td></tr> 
<tr><td><input name="field-4" type="text" /></td></tr> 

Пожалуйста, предложите решение.

Спасибо!

Answer 1

$('button#add_more').on('click', function() { 
    var table = $('table#myTable tbody'), 
     len = $('input[type=text]', table).length; 
    table.append('<tr><td><input name="field-'+ (len+1)+'" type="text" /></td></tr>'); 
}) 

DEMO

Answer 2

Demo :: http://jsfiddle.net/ankur20us/MTXhZ/

$('#click').click(function(){ 
    var totRows=$('#myTable tr').length; 

    $('#myTable').append("<tr><td><input name='field-"+ totRows +"' type='text' /></td></tr>") 

});​