I have some problems with selecting elements, with Jquery. When i try to select a element:
var images = $(\"#htmlChunk\").find(\"img.Thumb\");
console.log(images
Your images
variable is a jQuery object, so what you're seeing output in your browser's console seems to be that object. The specific output suggests that the call to .find()
isn't actually matching any elements; compare the two console outputs from this jsFiddle (in Chrome).
When you call a jQuery function - such as .find()
, .filter()
, etc - that narrows down, or changes, the list of matched elements on an existing jQuery object the resulting jQuery object also contains a reference to the state before that function was run, which is what you're seeing as prevObject
. This is what it uses to revert back to when you call the .end() function.
Let's break down your code:
var images = $(".htmlChunk").find("img.Thumb");
The first part - $(".htmlChunk")
- matches all elements that have the class htmlChunk
on them, and returns a jQuery object containing those elements.
Then you call .find("img.Thumb")
which looks for all elements that are descendents of the already matched elements (those with the class htmlChunk
) that satisfy the criteria of being an element and having the class
Thumb
on them.
You could use a single selector to retrieve the elements, which might give you better results:
var images = $(".htmlChunk img.Thumb");
If you want an array of the actual DOM elements, rather than a jQuery object containing them, you can use the .get() function:
var elementArray = images.get();
To address the edit to the question to include the HTML:
You're using Note the $(".htmlChunk")
to obtain the initial element. However, that htmlChunk
so that code won't select the element you need. You'll want to use the following:
var images = $("#htmlChunk").find("img.Thumb");
#
rather than the .
in the selector.