Cómo agregar Class al primer td en cada tr dentro de una tabla usando jQuery - jquery, html, jquery-selectors, html-table

Estoy tratando de agregar una clase al primer td dentro de un tr dentro de una clase específica. Pero por alguna razón agrega esta clase solo al primer td en el primer tr -no el primer td en cada tr

$("#appendTD").find("#gridFormInformation").children(0).children().each(
function() {
if ($("#appendTD").find("tr").filter(function() { return $(this).attr("class") == "ui-widget-content ui-subtblcell"; }).children("td:eq(0)").addClass("leftbord"));
}
);

Pero cuando modifico lo anterior quitando el "" td: eq (0) "agrega esta clase a cada td en cada tr ... entonces, ¿qué estoy haciendo mal?

Ejemplo del marcado a continuación

<td id="appendTD">
<table id="gridFormInformation">
<tbody>
<tr><th>1</th><th>2</th><th>3</th></tr>
<tr class="ui-widget-content ui-subtblcell"><td>1</td><td>2</td><td>3</td></tr>
<tr class="ui-widget-content ui-subtblcell"><td>1</td><td>2</td><td>3</td></tr>
<tr class="ui-widget-content ui-subtblcell"><td>1</td><td>2</td><td>3</td></tr>
</tbody>
</table>
</td>

Respuestas

Me parece que está utilizando una forma manual complicada para encontrar los tds a los que desea agregar la clase. Creo que sería más fácil usar los selectores jQuery para encontrar sus tds.

Reemplazar

$("#appendTD").find("#gridFormInformation").children(0).children().each(
function() {
if ($("#appendTD").find("tr").filter(function() { return $(this).attr("class") == "ui-widget-content ui-subtblcell"; }).children("td:eq(0)").addClass("leftbord"));
}
);

con

$("#gridFormInformation tr.ui-widget-content.ui-subtblcell").find("td:first").addClass("leftbord");

Esto encontraría todos los trs y para cada tr encontraría el primer td y agregaría la clase a eso.

Cambio "td:eq(0) a "td:first".

Este método es para agregar leftbord a la primera <td> en cada fila de la mesa gridFormInformation:

$("#gridFormInformation tr td:first-child").addClass("leftbord");