Caching complex jquery selector based on parent & type

Question

I'm trying to speed up jQuery performance. I found some questions/answers on this site to help but I'm trying to take it a step further...

Here's an example of the HTML, quite simplified

<div id="Container">
    <div>
        <div>
            <input type="text" id="something">
        </div>
        <input type="text" id="other">
    </div>
</div>

Now my jQuery...

// select all input text boxes inside the div with ID "Container"
var allInputText = $("#Container input:text");

// the inner workings of these have been removed...
allInputText.change().bind();

// Now I have 10+ class checks where I run a function on them...
$(".numeric").numeric();
// ...
$(".etc").etc();

The goal is to increase the speed of those 10+ class checks. They are all the same textboxes in the div "Container", just with different classes specified. It works if I do this:

var myContainer = document.getElementById("Container");
$(".numeric", myContainer).numeric();

But it doesn't work if I do this:

$(".numeric", allInputText);

Ideally I'd like to use the "allInputText" because really I'm only looking for ".numeric" classes on input text boxes that are in the Container div. This was cached right above to perform the change() and bind(), but now I want to do more on those except different things for different classes. Any ideas how to achieve this with the best possible caching performance?

Answer 1

Since you have the set of elements you need to filter the set than find within the set which is what your code was doing.

Try allInputText.filter(".numeric")