passing variables from a link

[tgavin]

<a href="#" class="foo" data-email="test@test.com">test 1</a><br>
<a href="#" class="foo" data-email="me@email.com">test 2</a>
 
<script>
    $(document).ready(function(){
        $('.foo').click(function() {
        var email = $('.foo').attr('data-email');
        alert(email);
    });
});
</script>

I'm trying to pass the value of data-email to my script, and as you javascript guys know, this isn't working correctly. How can I do this?

Thanks!

[Pullo]

Hi there,

This isn't hard. Use $(this) which in the context of your event handler will always refer to the element that recieved the click.

$(document).ready(function(){
  $('.foo').click(function() {
    var email = $(this).data('email');
    console.log(email);
  });
});

Also, don't write $('.foo').attr('data-email'), use jQuery's data API instead: $(this).data('email');

[tgavin]

thanks!