Possible to perform an additional jquery selection on stored selector object?

Question

Example data:

<input class="foo" special="yes" value="1" new="yes">
<input class="foo" special="no" value="2" new="yes">
<input class="foo" value="3" new="red">
<input class="foo" special="yes" value="4">
<input class="foo" value="5" new="yes">

now the jquery:

var the_inputs = $("input.foo");

...will give me a jquery object of all the inputs.

I can also do:

var the_special_inputs = $("input.foo[special]");

... which returns only the inputs that have a special attribute.

Even further, I can get just the inputs that have a special attribute where they also have the attribute new of "yes":

var the_special_inputs = $("input.foo[special][new='yes']");

But what if I just wanted to use 'the_inputs' and create the var the_special_inputs without doing another selector? in there words, if I have the stored var:

var the_inputs = $("input.foo");

...is there a way to write an additional selector on that stored var that would give me the same results as $("input.foo[special]"); or the others like above but JUST using the_inputs which was previously stored?

a few things I've tried that don't work:

$(the_inputs+"[special][new='yes']");
$("[special]",the_inputs);

is it possible?

Answer 1

Use jQuery's .filter() method.

var the_inputs = $("input.foo");
var the_special_inputs = the_inputs.filter("[special][new='yes']");

This will create a new set that is the original reduced to those that match the selector you pass without having to do an additional DOM selection.

There's another method called .not() that retains those that do not match the selector.

Answer 2

You can use the jQuery find() method as well, but filter is much better :

var the_inputs = $("input.foo");
var the_special_inputs = the_inputs.find("[special][new='yes']");