Getting the text of the first <td> in the same row as another <td>

Question

I'm running into a problem more and more often, where I have an event handler tied to a <td>, and I need to get the text in the first <td> in that row (which is the primary key). What's the easiest way to do that, assuming I don't want to add any additional markup?

Answer 1

You would go to the parent <tr> and then from the parent to the 1st child.

Answer 2

Using JQuery you could write something like this:

function eventHandler()
{
    var firstTdText = $(this).parent().children("td:first").html();
}

Assuming of course, that "this" references the html TD.

Answer 3

To reference the first cell in that row, you can select it using the prevAll selector:

$(this).prevAll("td:last")

To get the text from it:

$(this).prevAll("td:last").html()
// or,
$(this).prevAll("td:last").text()