Why can’t I select a <td> using its class and data-test attributes in jQuery?

Question

<table>
    <tr>
        <td class="ok" data-test="12-12 00">xxx</td>
        <td class="ok" data-test="13-12 00">xxx</td>
        <td class="ok" data-test="14-12 00">xxx</td>
        <td class="ok" data-test="15-12 00">xxx</td>
    </tr>
</table>

​I would like get the <td> where data-test = "14-12 00". Here’s my code:

alert($('td .ok[data-test="14-12 00"]').text());​

Why is this not working?

http://jsfiddle.net/LqD5h/

Answer 1

Try:

alert($('td.ok[data-test="14-12 00"]').text());​

(Notice there is no space between td and .ok).

You were originally trying to select all elements with classname ok that are descendants of a td and bear a certain data-test value.

Answer 2

How about another way to skin this cat?

alert($('tr .ok[data-test="14-12 00"]').text());​

Notice, td changed to tr. :-)