jQuery: selecting each td in a tr

Question

I need a way to interact with each td element in a tr.

To elaborate, I would like to access the first table row, then the first column, then the second column, etc. Then move onto the second row and repeat the process.

Something like this (pseudo-code):

for each row in table {   for each column in row   {     do cool things   } } 

jQuery:

$('#tblNewAttendees tr').each(function() {   alert('tr');   //Cool jquery magic that lets me iterate over all the td only in this row   $(magicSelector).each(function(){     alert('hi');   });  }); 

HTML:

<table>      <thead>           <th>someHeader</th>      </thead>      <tbody>           <tr>                <td>want to grab this first</td>                <td> this second </td>           </tr>           <tr>                <td>this third</td>                <td>this fourth</td>           </tr>      </tbody> </table> 

Answer 1

You can simply do the following inside your TR loop:

$(this).find('td').each (function() {   // do your cool stuff });