CODEWITHSUNDEEP
jqueryjquery-selectors
Ellen
Ellen

Reputation: 178

JQuery selectors -- why does adding a filter return MORE elements?

I know there are a lot of questions about JQuery selectors, but I'm not seeing my particular problem.

If I use this selector, it finds 2 elements, both class "dluSingle". One has an id of "F45_rdefault_F48” and one has an id of “F45_r0_F48”.

linkGridDiv.find('.dluSingle')

So, I figured that this code would return just the element with the id of "F45_r0_F48."

linkGridDiv.find('.dluSingle [id *= "r0"]')

Instead, it returns 5 elements, all containing "r0" in the id, but none of them of class type "dluSingle".

It would make more sense to me if it found nothing. Why would adding an extra filter return more results instead of fewer? What am I not understanding? Thanks for any help!

Upvotes: 0

Views: 45

Answers (2)

Zach Ingbretsen
Zach Ingbretsen

Reputation: 193

By including a space between your class and your "filter", jQuery treats your filter as a descendant selector.

In other words, it looks for any child, grand-child, etc. element that is below your dluSingle class. To look for the element with the class "dluSingle" and "r0" in the id you can simply do:

linkGridDiv.find('.dluSingle[id *= "r0"]')

For completeness,

linkGridDiv.find('.dluSingle [id *= "r0"]')

looks for any element with "r0" in the id that is a descendent of an element with the class ".dluSingle", and

linkGridDiv.find('.dluSingle > [id *= "r0"]')

looks for any element with "r0" in the id that is a child of an element with the class ".dluSingle".

Upvotes: 2

getbuckts
getbuckts

Reputation: 386

Try that, there's no space between the class selection and the attribute selection.

linkGridDiv.find('.dluSingle[id *= "r0"]')

Upvotes: 1

Related Questions