jquery get all elements matching data attribute name

Question

say i have a few elements with the following data attribute:

<data-my-key="blah">

and i want to attach an event to them all, how can this be done?

I have tried a few things but cant get it to work.

My latest attempt was:

$('data-my-key').click(...

and

$(document).find('data-my-key').click(...

A note on how you're using the selector. Just using the name would select the element. Meaning, the way you had it with just a string, $('div').click would select all DIV elements. $('#div') would select elements with id='div' and $('.div') would select elements with a class='div'. Of course, it would be strange to give an element an ID or Class of div but it's just an example on selection syntax. — Michael Khalili
– Michael Khalili, Commented Dec 14, 2016 at 22:27

Rory McCrossan · Accepted Answer · 2013-11-20 09:55:01Z

58

You can use the attribute selector:

$('[data-my-key]').click(...

Note however, that jQuery stores data attributes added after DOM load in it's internal cache not as an attribute on the element, so that selector would not work for those. In that case you would need to use filter:

$(document).children().filter(function() {
    return $(this).data('my-key');
}).click(...;

answered Nov 20, 2013 at 9:55

Rory McCrossan

338k41 gold badges322 silver badges353 bronze badges

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

1 Comment

Marty Wallace Over a year ago

damn!! - i was so close :)

Adil · Accepted Answer · 2013-11-20 09:55:13Z

9

You can use has attribute selector and give the attribute name.

$('[data-my-key]').click...

answered Nov 20, 2013 at 9:55

Adil

148k25 gold badges217 silver badges207 bronze badges

Collectives™ on Stack Overflow

jquery get all elements matching data attribute name

2 Answers 2

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related