Select first sibling
dom, html, jquery, jquery-1.3.2, siblings
Solution
$( 'td:first-child', $( this ).parents ( 'tr' ) ).html ();
This will select the first TD element (:first-child filter) in the parent TR of the image. `parents()` returns all parents of the element, and we filter the parents so that only TR elements are returned.
Also try writing your image like so:
<img src="bobsmith.png" onclick="doSomething(this)" />
and your function like so:
function doSomething ( imgEl ) {
}
and use `imgEl` instead of `this`
Problem
I'm trying to select the inner value of the first sibling - using jQuery - in an environment where I cannot alter the html markup. I have the following: ``` <tr> <td>3</td> <td>bob</td> <td>smith</td> <td>bob@example.com</td> <td> <img src="bobsmith.png" onclick="doSomething()" /> </td> </tr> ``` I'm trying to get the value of the first `<td>` with the following: ``` function doSomething() { var temp = $(this).parent().parent().children().filter(':first'); alert("you clicked person #" + temp.html()); } ``` All I get from this is `null`. I've tried various combinations with with the `.siblings()` function too, but to no avail. Any ideas? Thanks, Note: I forgot to mention that the table the excerpt is from is dynamically loaded & refreshed from an ajax call. This may be pertinent for suggestions that include binds. Solution: I've gone with the following solution, inspired by the accepted answer: ``` <tr> <td>3</td> <td>bob</td> <td>smith</td> <td>bob@example.com</td> <td> <img src="bobsmith.png" onclick="doSomething(this)" /> </td> </tr> ``` and for the jQuery javascript: ``` function startStopNode(el) { var temp = $(el).parent().siblings(':first').html(); alert("you clicked: " + temp); } ```