Question

I need to add:

• an ID to the table in my form
• a numbered sequence of classes to a certain amount of TD’s in every next TR in that table (three td’s in this case)

I’ve got next html-model:

<form id="myform">
<table>
 <tr>
  <td>some text</td>
  <td>some text</td>
  <td>some text</td>
</tr>
 <tr>
  <td>some text</td>
  <td>some text</td>
  <td>some text</td>
</tr>
</table>
</form>

I need that to be like this after jquery applied:

<form id="myform">                   <!--no changes-->
 <table id="table1">                 <!--changed-->
  <tr>       
   <td class="td1">some text</td>    <!--changed-->
   <td class="td2">some text</td>    <!--changed-->
   <td class="td3">some text</td>    <!--changed-->
  </tr>
  <tr>       
   <td class="td1">some text</td>    <!--changed-->
   <td class="td2">some text</td>    <!--changed-->
   <td class="td3">some text</td>    <!--changed-->
  </tr>
 </table>
</form>

Answer 1

$('#myform table').each(function(i, v) {
   $(v).attr('id','table' + (i + 1)).find('tr').each(function(idx, val) {
        $(val).children().each(function(index,element) {
            $(element).addClass('td' + (index + 1));
        });
   });
});