jQuery selector for HTML5 data attributes

Question

I have this button with multiple data attributes, and i want to hide it by selecting it based on class and two data attributes.

<a href='#' class='wishlist-icon' data-wish-name='product' data-wish-url='/product'>Button</a>

$(".wishlist-icon [data-wish-name='product'] [data-wish-url='/product']").hide();

I don't know why this selector doesn't work.

DEMO

The space is the descendant selector. You are looking for an element [data-wish-url='/product'] inside an element [data-wish-name='product'] inside an element .wishlist-icon. If you want to select an element based on multiple selectors, you have to write them together. — Felix Kling
– Felix Kling, Commented Sep 14, 2013 at 10:43

Sachin · Accepted Answer · 2013-09-14 10:28:46Z

7

Just remove the space between the selector.

$(".wishlist-icon[data-wish-name='product'][data-wish-url='/product']").hide();

Js Fiddle Demo

answered Sep 14, 2013 at 10:28

Sachin

41.1k7 gold badges94 silver badges107 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Dušan Over a year ago

I know, i just had to wait for certain period :)

Collectives™ on Stack Overflow

jQuery selector for HTML5 data attributes

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related