How Do I Select a `td` Element in a Row That Has a Checkbox That is Checked?

Question

I have a table that looks somethings like this:

<table>
  <tr class="row even">
    <td><input type="checkbox" /></td>
    <td class="name">foo</td>
    <td class="metric">22</td>
  </tr>

  ...etc

What I want to do is get an array of all td.metric only in rows that have the checkbox checked. This didn't work out as expected:

var ticks = $.map($("tr td input:checked td.metric"), function(v,i){ return ... }); 

Answer 1

Use the :has selector:

$('tr:has(input:checked) > .metric');

http://jsfiddle.net/RqjFX/