HTML's data attribute undefined in jQuery

Question

I'm using the following code to access an HTML data attribute:

HTML

<p class="add-favorites-to-list">
  <a href="#" data-baskettype="order"><img src="/style/icons/cart_add.png"> Test1</a>
  <a href="#" data-baskettype="quote"><img src="/style/icons/calculator_add.png"> Test2</a>
</p>

JS

$(document).ready(function() {
  $('.add-favorites-to-list').show();
  $('.add-favorites-to-list a').click(function() {
    alert($(this).data('baskettype'));
    return false;
  });
});

CSS

.add-favorites-to-list { display: none; }

Example: http://jsfiddle.net/mR8gK/1/

Which works fine on jsFiddle, however it doesn't work in my site (with the same code and the same browser). I get an undefined in the alert().

I've checked if jQuery finds the element and it does, because: console.log($(this).html()); shows the contents of the element.

Is there any (obvious) reason why that code wouldn't work in my site but does work on jsFiddle?

@adam: At the top of my document I've got: <!DOCTYPE html>. Which should be HTML5 if I'm not mistaken. — PeeHaa
– PeeHaa, Commented Jul 18, 2011 at 12:37

Phil · Accepted Answer · 2011-07-18 12:37:22Z

5

What version of jQuery are you running? Because if you drop it below 1.4.4 it comes back as undefined.

answered Jul 18, 2011 at 12:37

Phil

11.2k18 gold badges73 silver badges106 bronze badges

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

2 Comments

PeeHaa Over a year ago

Ha! Phil: you rock!!! It is an old project I'm working on. And forgot it was still using 1.4.2. Time for an upgrade.

Phil Over a year ago

Yay, glad I was able to help!

Collectives™ on Stack Overflow

HTML's data attribute undefined in jQuery

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related