jQuery how to get the class or id of last clicked element?

Question

I am trying to get the class or an id of the last clicked element. This is what I have based off of what I found here...

HTML

<a href="" class="button">Button</a>

JQUERY

$('.button').click(function () {
          myFuntion();
});

function myFunction (e) {
 e = e || event;
 $.lastClicked = e.target || e.srcElement;

 var lastClickedElement = $.lastClicked;
 console.log(lastClickedElement);

}

This sort of does what I want, but I am not sure how to go about modifying it so I can get just the class.

I have also tried using this solution but couldn't get it to work with my code.

$('.button').click(function () {
  myFuntion();
});


function myFunction(){
    var lastID;
    lastID = $(this).attr("id");

    console.log(lastID);
}

When I do this my console log comes back as undefined. I am probably missing something obvious. Any help is much appreciated. Thanks.

Thanks everybody for the fast responses. I will look through these starting with the first reply and see if I can get anything to work. — khollenbeck, Aug 29 '12 at 16:00

score 1 · Answer 1 · answered Aug 29 '12 at 15:50

1

A couple of ways come to mind:

$(".button").click(myFunction);

Should work with the above myFunction.

$(".button").click(function () { myFunction($(this)); });
function myFunction($elem) {
   var lastID;
   lastID = $elem.attr('id');
   $.data('lastID', lastID);
}

answered Aug 29 '12 at 15:50

Explosion Pills

188,624
52
326
405

I tried this and I get a console error.. Uncaught TypeError: Object # – khollenbeck Aug 29 '12 at 16:11
I am trying class instead of ID... I will double check, but I think I get the same error regardless – khollenbeck Aug 29 '12 at 16:12
I get this error ... Uncaught TypeError: Object # – khollenbeck Aug 29 '12 at 16:13

Zbigniew · Accepted Answer · 2012-08-29T16:30:59.403

1

You can pass clicked element as parameter to your function:

$('.button').click(function () {
    myFunction(this);
});

function myFunction(element) {
    console.log(element);
    console.log(element.id);
    console.log($(element).attr("class"));
}

UPDATE added jsfiddle

edited Aug 29 '12 at 16:30

answered Aug 29 '12 at 15:50

Zbigniew

27,184
6
59
66

Is it possible to do this for a class? – khollenbeck Aug 29 '12 at 16:26
Sure, inside `myFunction`: `console.log($(element).attr("class"));` – Zbigniew Aug 29 '12 at 16:29
Okay this is very close to what I want to do and everything seems to work. – khollenbeck Aug 29 '12 at 16:32
I would like to maybe make the click handler simpler something like $('.button').click(myFunction); ... But this is good I can make this work. I felt like it should be basic but I wasn't sure what I needed exactly. thanks for your help. – khollenbeck Aug 29 '12 at 16:36
1

Well, it turns that you can do this, I wasn't fully aware of this. Check this [jsfiddle snippet](http://jsfiddle.net/Xgrcn/4/) and don't be afraid to experiment :P – Zbigniew Aug 29 '12 at 16:41
This was where I was trying to get. So thanks again.. http://jsfiddle.net/krishollenbeck/Xgrcn/7/ – khollenbeck Aug 29 '12 at 16:49

score 1 · Answer 3 · answered Aug 29 '12 at 15:51

1

In order to get the class-name of the element, assuming you have an accurate reference to the element from which you want to retrieve the data:

var lastClickedElement = $.lastClicked,
    lastClickedElementClassNames = lastClickedElement.className;

This does return the full list of all the classes of the element though.

answered Aug 29 '12 at 15:51

David Thomas

249,100
51
377
410

I tried this with what I have and I get the whole HTML element in my console.log .. Here is my fiddle. http://jsfiddle.net/krishollenbeck/hZh9B/5/ – khollenbeck Aug 29 '12 at 16:25

score 1 · Answer 4 · answered Aug 29 '12 at 15:51

1

$('.button').click(function () {
  myFuntion(this);
});


function myFunction(ele){
    var lastID;
    lastID = $(ele).attr("id");

    console.log(lastID);
}

answered Aug 29 '12 at 15:51

Dan Barzilay

4,974
5
27
39

score 0 · Answer 5 · answered Aug 29 '12 at 16:37

First Select all possible DOM Elements

 var lastSelectedElement = null

    $(document).ready(function(){
       $("*").live("click",function(){
       lastSelectedElement = $(this);
       myFunction($(this));
      });
    });

   function myFunction(element) {
console.log(element);
console.log(element.id);
console.log($(element).attr("class"));
 }

than you could play with lastSelectedElement by grabbing it's ID or Class with jQuery .attr("ID OR CLASS");

jQuery how to get the class or id of last clicked element?

5 Answers5

Linked