Question

JQuery/JS newbie here – but so far enjoying the learning experience.

My scenario:

I have multiple buttons like so:

<button id="thumb-1" class="thumbs">click 1</button>
<button id="thumb-2" class="thumbs">click 2</button>
<button id="thumb-3" class="thumbs">click 3</button>

When a user clicks one, I pass it to a custom function via the this keyword like so:

$('.thumbs').click(function(){
    $.fn.myFunc(this);
}

Which will send the jQuery object to the function, i.e the entire button html.

<button id="thumb-x" class="thumbs">click x</button>

Now what I want to do is grab the id of that button and store it on a string variable.
Using the following doesn’t work of course a html button element has no attr method.

$.fn.myFunc = function(button) { 
    var id = button.attr('id');
}

Anybody have any simple ideas?

Thanks!
– James

Answer 1

If you want to use attr() then convert button to jquery object or if you want to get id from javascript object then use button.id

$.fn.myFunc = function(button) { 

    var id = $(button).attr('id'); // with jquery object
    id = button.id; //with javascript object 
}