Increment ID of selected cloned elements by one

Increment ID of selected cloned elements by one

Hi i have following code:

      <input type="button" name="addNew" id="addNew" value="Add New Activity" />
      <table border="1" class="likertBorder" cellpadding="2" id="actTbl" >

        <tr class="likertBorder responseRow" id="actRow">
            <td class="likertBorder" valign="middle" align="center">
                <select id="SPORT1" name="SPORT1" onchange="display_sports_followup();" onblur="display_sports_followup();">
                    <option value="">-- Select Activity --</option>
                    <option value="2020">(push ups&#44; sit ups) vigorous effort</option>
                    <option value="3015">aerobic&#44; general</option>
                    <option value="3050">American Indian dancing</option>
                </select><br />
               
                <div id="SPORT1_spec_followup">
                 please specify:<input style="margin-left:5px;" id="SPORT1_spec" type="text" name="SPORT1_spec" maxlength="500" size="50" value=""/>
                </div>
                </td>   
                <td class="likertBorder" valign="middle" align="center">
                <input style="margin-left:5px;" id="SPORT1D" type="text" name="SPORT1D" maxlength="3" size="3" value="" onkeyup="display_sports_followup();" />        
                </td>   
                <td class="likertBorder" valign="middle" align="center">
                <input style="margin-left:5px;" id="SPORT1M" type="text" name="SPORT1M" maxlength="3" size="3" value="" onkeyup="display_sports_followup();" />        
                <span class="responseText">Minutes per  Day </span>
                </td>   
        </tr>
       
</table>


And JQUERY code:

$(document).ready(function() {
                  $('#addNew').live("click", function()
                   {
                      $('#actTbl tbody>tr:last').clone(true).insertAfter('#actTbl tbody>tr:last');
                      return false;
                  });
                });

Its adding a new row with all child elements but i am unable to assign unique ID's.  I'd like increment ID by one or append existing id with some unique number.


Also when i refresh page all loaded elements gets removed. Is there a way so that these newly added rows,Td, text boxes and select stays even when page is refreshed.

Thanks