Get element by id from existing jQuery object

Question

Ok this has got to be a stupid simple one, but I just can't find the documentation

  <ul>
      <li class="foo" id="jack"  ></li>
      <li class="foo" id="jill"  ></li>
      <li class="foo" id="tom"   ></li>
      <li class="foo" id="dick"  ></li>
      <li class="foo" id="harry" ></li>
  </ul>

And the simple jQuery

 var listItems = $('li.foo');

now how do I get #jack from listItems ? I already know .eq() .get() .find() ect. but not one that will work in one move. Not based on index, not looking for a child or parent, but based on the id of existing elements selected. Anyone know this one?

Answer 1

Whenever you're dealing with an id there is no need to do a sub-query. An ID is unique and can just be queried directly

$('#jack')

If you did want to do a sub-query though for a non-ID value then look to filter

$('ul li').filter('.foo')

Answer 2

Use .filter() like so:

listItems.filter('#jack');