Extending Clone Table Rows functionality - changing row ID
<p>I have this fiddle at: <a href="http://jsfiddle.net/radi8/EwQUW/33/" rel="nofollow">http://jsfiddle.net/radi8/EwQUW/33/</a></p>

<p>Notice that the initial table is defined is:</p>

<pre><code>&lt;table class="reference" width="100%" border="1" align=left id="secondaryEmails"&gt;
&lt;thead&gt;
    &lt;tr&gt;
        &lt;th width="30%"&gt;SelectRow&lt;/th&gt;
        &lt;th width="40%"&gt;Email&lt;/th&gt;
        &lt;th width="30%"&gt;Ship Type&lt;/th&gt;
    &lt;/tr&gt;
&lt;/thead&gt;
&lt;tbody&gt;
    &lt;tr id="template" style="display:none"&gt;
        &lt;td align="center"&gt;
            &lt;input type=radio id="index_" name = "index" value="0"&gt;
        &lt;/td&gt;
        &lt;td align="center"&gt;
            &lt;input type="text" id="email_" name ="email_" value="" size=40&gt;
        &lt;/td&gt;
        &lt;td align="center"&gt;
            &lt;select style=width:150 id="shipType_" name="shipType_"&gt;
                &lt;option value="0" "selected"&gt;Both&lt;/option&gt;
                &lt;option value="1"&gt;Over Road&lt;/option&gt;          
                &lt;option value="2"&gt;Over Rail&lt;/option&gt;
            &lt;/select&gt;
        &lt;/td&gt;
    &lt;/tr&gt;
    &lt;tr&gt;
        &lt;td align="center"&gt;
            &lt;input type=radio id="index_2" name = "index" value="2"&gt;
        &lt;/td&gt;
        &lt;td align="center"&gt;
            &lt;input type="text" id="email_2" name ="email_2" value="eml@domain.com" size=40&gt;
        &lt;/td&gt;
        &lt;td align="center"&gt;
            &lt;select style=width:150 name="shipType_2" id="shipType_2"&gt;
                &lt;option value="0" &gt;Both&lt;/option&gt;
                &lt;option value="1" &gt;Over Road&lt;/option&gt;
                &lt;option value="2" selected&gt;Over Rail&lt;/option&gt;
            &lt;/select&gt;
        &lt;/td&gt;
    &lt;/tr&gt;
&lt;/tbody&gt;
&lt;tfoot&gt;
    &lt;tr&gt;
        &lt;th align="center"&gt;
            &lt;button id='Add'&gt;Add Row&lt;/button&gt;
        &lt;/th&gt;
        &lt;th&gt;&amp;nbsp;&lt;/th&gt;
        &lt;th align="center"&gt;
            &lt;button id='update'&gt;Update&lt;/button&gt;
        &lt;/th&gt;
    &lt;/tr&gt;
&lt;/tfoot&gt;
</code></pre>

<p></p>

<p>When I clone the first row, I need to change the ID of the new row to something like </p>

<pre><code>&lt;tr id="emlRow_1"&gt;
</code></pre>

<p>where the number is the new ID of the row.</p>

<p>Can someone guide me on how to do this?</p>
