javascriptjqueryjquery-selectorsabbr

How can I select element that has specific value for 'abbr' attribute with jquery

Part of my html is :

<tr id="row">
  <td abbr='selectme'>
    <div>Texti inside the div</div>
    Text outside the div
  </td>

  <td>
    any others I dont care about
  <td>
</tr>

And I am trying to select "Text outside the div" which is inside the td that has attribute 'selectme' . How can I accomplish that with jquery?

I tried like this:

$("#row").find("[abbr='selectme']").text()

but it returns nothing.

Solution

  • .text() returns the text content of the descendant elements also, filter them out

    var text = $("#row").find("[abbr='selectme']").contents().filter(function () {
    //select only text nodes of the targetted td element
    return this.nodeType == 3
}).text();

    Demo: Fiddle