Storing a collection of HTML elements in a variable for later use

This is the jQuery problem that I am facing, and I always have to solve using methods that I am not proud of.

I am trying to keep a collection of items for later evaluation. The problem is that every time I try to access and apply a function to it, the error console reports that it is not a function. I am convinced that I have a misunderstanding of how jQuery works. However, I would like to be pointed in the right direction. Here is the code I'm using:

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

and here is the error I get:

Uncaught TypeError: Property 'children' of object #<HTMLUListElement> is not a function
+3
source share
2 answers

You are trying to call the jQuery method from HTMLElement. Try wrapping the element reference in a new jQuery object:

productLists[i] = $(products[i]).children('li');

$.each this . products[i] this:

$.each( products, function() {
  productsList.push( $(this).children("li") );
});

, jQuery :

var productList = $("ul.products li"); // All list items in ul.products

, . , , , , .clone:

var productList = $("ul.products li").clone();
+6

jquery. , :

$('ul.products').each(function(){
  productsList.push( $(this).children("li") );
})
, jQuery.
0

All Articles