jQuery looping with .each and using selectors with $(this)
<p>I'm currently having to extend an very old ASP.NET site which has a database generated front end and is a behemoth of an application, it needs completely rewriting - however I've been told to add to it than redevelop it - rats!</p>

<p>Okay the backend renders the following table on the front end:</p>

<pre><code>&lt;table id="tableID"&gt;
&lt;tr&gt;
    &lt;td class="qCol"&gt;
    &lt;!-- Label here --&gt;
    &lt;/td&gt;

    &lt;td class="qCo2"&gt;
    &lt;!-- img here --&gt;
    &lt;!-- and a text box --&gt;
    &lt;/td&gt;

    &lt;td class="qCo3"&gt;
    &lt;!-- select menu here --&gt;
    &lt;/td&gt;

    &lt;td class="qCo4"&gt;
    &lt;!-- radio buttons here --&gt;
    &lt;/td&gt;

    &lt;td class="qCo5"&gt;
    &lt;!-- select menu here --&gt;
    &lt;/td&gt;

    &lt;td class="qCo6"&gt;
    &lt;!-- hidden validation image here --&gt;
    &lt;/td&gt;
&lt;tr&gt;
&lt;/table&gt;
</code></pre>

<p>Now (Please don't ask why) I have to overwrite content of the td with the class "qCol" with the contents of the td with the class "qCo5".</p>

<p>This is a pretty easy affair using jQuery:</p>

<pre><code>$('#tableID td.qCol').html($('#tableID td.aCo5').html());
</code></pre>

<p>Now I've amended the backend so more rows are generated for the table, none of these rows have an id and I need to do this HTML overwrite between the tds for each row (there will be 4 rows in total).</p>

<p>I know how to do this using JavaScript and a bit of looping but I want to get into the habit of using jQuery to do this, incorporating the .each() method.</p>

<p>I'm confused how I'd use "<code>this</code>" and then select the appropriate td, for example...</p>

<pre><code>$('#tableID tr').each(function () {
      $(this).find('td .qCol').html($(this).find('td.aCo5').html());
});
</code></pre>

<p>What's the best way to do this? </p>

<p>If this question is poorly explained please say so and I'll expand</p>
