Incrementing numeric content of td cell after adding row to table

Incrementing numeric content of td cell after adding row to table

I use the following to add a new row to a table:

  1. $(".add-row").live('click', function(){
  2.         var thisTableId = $(this).parents("table").attr("id");
  3.         var lastRow = $('#'+thisTableId + " tr:last");
  4.         var newRow = lastRow.clone(true);
  5.         $('#'+thisTableId).append(newRow);
  6.         $('#'+thisTableId + " tr:last td :input").val('');
  7.         return false;
  8. });
The form data is cleared, however, the first td cell contains a counter, so when a new row is added, the last number is displayed. For example, if there are 3 rows, the first td cell for each row contains 1, 2, 3, and adding a new row display 3 again. How can it be done so that instead of 3, it displays the next number each time a row is added? Thanks.