ua_boaz ua_boaz - 3 months ago 5
HTML Question

jquery tr selector not working

var row="<tr><td>"+segmentData.segmentName+"</td>" +
"<td></td>"+
"<td>"+segmentData.transTimelyTotal+"</td>"+
"<td></td>"+
"<td>"+segmentData.transUntimelyTotal+"</td>"+
"<td></td>"+
"<td>"+segmentData.transAmtTimelyTotal+"</td>"+
"<td></td>"+
"<td>"+segmentData.transAmtUntimelyTotal+"</td>"+
"</tr>";
var $row=$(row)

var td = $("tr:nth-child(2)", $row);


I have above html row described in javascript and from there i am trying to get a td element at location third but it doesn't seem to be working as expected.

I am getting an undefined object, you can see the result below.

Any better way to get td element at location 2nd?

[prevObject: m.fn.init[1], context: undefined, selector: "tr:even"]

Answer

You're using nth-child selector the wrong way. tr:nth-child does not return the tr's children, but instead returns the tr elements that are the nth-children of their respective parents. What your selector should be

"tr td:nth-child(2)"

But since good HTML practices imply that tr elements should only contain td elements as the children, this selector would be enough:

"td:nth-child(2)"

Going back to your question, you asked the selector for the 2nd td and not the 2nth td. So, none of the above selectors are right. Here is what you should use:

"td:eq(2)"

Refer the spec for nth-child here

Refer the spec for eq here

Comments