Storing collection of HTML elements in variable for later use
<p>Here is a jQuery issue that I come across and always have to resolve using methods I'm not proud of.</p>

<p>I'm attempting to store a collection of elements for later assessment. The problem is that every time I try to access and apply any function to it, the error console reports the it is not a function. I'm convinced that I have a misunderstand of how jQuery works. Nonetheless, I'd like to be pointed in the right direction. Here is the code I am using:</p>

<pre><code>var products = $('ul.products');
var productLists = []
$.each(products, function (i) {
    productLists[i] = products[i].children('li');
    console.log(productLists[i]);
});
</code></pre>

<p>and here is the error I get:</p>

<pre><code>Uncaught TypeError: Property 'children' of object #&lt;HTMLUListElement&gt; is not a function
</code></pre>
