How to write a function in jquery/javascript to add new html TDs?
<p>Assume I have an array "numbers" that contains numbers from 1 to 97 and the following table where each row can only have 4 tds:</p>

<pre><code>&lt;table id="mytable"&gt;
&lt;tr&gt;&lt;td&gt;1&lt;/td&gt;&lt;td&gt;2&lt;/td&gt;&lt;td&gt;3&lt;/td&gt;&lt;td&gt;4&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td&gt;5&lt;/td&gt;&lt;td&gt;6&lt;/td&gt;&lt;td&gt;7&lt;/td&gt;&lt;td&gt;8&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td&gt;9&lt;/td&gt;&lt;td&gt;10&lt;/td&gt;&lt;/tr&gt;
&lt;/table&gt;
</code></pre>

<p>How to best create a function such that clicking on a link "Add" will call a javascript function that can add a new "td" to the table (the number 11, which is at index 10 in the numbers array), and when it hits the 4 column limit, it would create a new row.</p>

<p>Also, is there some good way to write a function that could count how many TDs are in the table at any given time?</p>

<p>What is the ideal way to do this?</p>
