Extract attribute from DOM element with jQuery

Question

Here's a code that I have

    <button data-id="123">
        Restore
    </button>
    function aButtonPressed(id){
        alert(id);
    }
    $(document).ready(function() {
        $('button').on('click', function(){aButtonPressed(data-id);});
    });

I want the function to show in alert box string "123". How should I extract the data-id?

You can use `$(this).data('id')` in the button click callback. — Tushar, Feb 29 '16 at 13:51
Possible duplicate of [How to get the data-id attribute?](http://stackoverflow.com/questions/5309926/how-to-get-the-data-id-attribute) — chiliNUT, Feb 29 '16 at 14:06

score 1 · Accepted Answer · answered Feb 29 '16 at 13:52

1

Change to this

$('button').on('click', function(){
alert($(this).data('id'));
})

answered Feb 29 '16 at 13:52

Jagdish Idhate

7,513
9
35
51

score 1 · Answer 2 · answered Feb 29 '16 at 14:03

1

Try this

  $('button').on('click', function(){aButtonPressed($(this).attr('data-id'));});

answered Feb 29 '16 at 14:03

REDEVI_

684
8
18

score 0 · Answer 3 · answered Feb 29 '16 at 14:00

0

use dataset property : https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/dataset

var btn = document.querySelector('button');

btn.onclick = function(){
      console.log(btn.dataset.id);
};

answered Feb 29 '16 at 14:00

Ramanlfc

8,283
1
18
24

Extract attribute from DOM element with jQuery

3 Answers3