title: How to use jQuery to dynamically update IDs after cloning a table row?
body: <p>When triggered, the 3rd (bottom) row of a table is cloned. In the CSS, this row (#tr3) is set to: display:none;  Here is the table row I am cloning:</p>
  
  <pre><code>&lt;tr name="tr3" id="tr3"&gt;
      &lt;td&gt;&lt;input type="text" name="dt1" id="dt1"&gt;&lt;/td&gt;
      &lt;td&gt;&lt;input type="text" name="fn1" id="fn1"&gt;&lt;/td&gt;
      &lt;td&gt;&lt;a href="#" name="change1" id="change1"&gt;change&lt;/a&gt;&lt;/td&gt;
      &lt;td&gt;&lt;a href="#" name="del1" id="del1"&gt;delete&lt;/a&gt;&lt;/td&gt;
  &lt;/tr&gt;
  </code></pre>
  
  <p>This is the JQuery code to clone the row. Not mine, sadly, so I don't understand all of it.</p>
  
  <pre><code>$("table tr:nth-child(4)").clone().find("input").each(function() {
      $(this).val('').attr('id', function(_, id) {
      return id + count;
  });
  </code></pre>
  
  <p>Specifically, how does the function in line 2 work - what is the underscore?</p>
  
  <p>Here's what I came for, though. How can I:</p>
  
  <ol>
  <li>change the style to display:block for cloned rows, and</li>
  <li>update the ids of the anchor tags in the cloned rows. The IDs of the input fields Do update (e.g. fn1 => fn11, fn12, fn13, fn14, etc).</li>
  </ol>
  
  <p>Thank you.</p>