Question

I have a table with a bunch of data. Each <td> contains class="person" and id=0,1,2,3, etc. based on $i (I’m using a loop to build my table from an array).

I’d like it so that whenever a person (<td>) is clicked, that cell gets highlighted with some css.

So far I think I can use this:

$(‘.person’).click(function(){

$id = some function to which attr('id') was selected???;
$('id').addClass("highlights");

});

Does anyone know how I can fetch the ID of the cell being clicked? Any help or approaches appreciated.

Thanks!

Answer 1

this.id refers to the id of the td inside the method.

$('.person').click(function(){

    var id = this.id;
    $('#' +id).addClass("highlights");

});

But if you want to just change something on the element, then you do not really need the id. That is because the this keyword refers to the actual clicked element.

So you can directly do

$('.person').click(function
    $(this).addClass("highlights");
});

---

Beware, though, that the id of an element cannot be numeric (as far as valid html is concerned..)

And i quote

ID and NAME tokens must begin with a letter ([A-Za-z]) and may be followed by any number of letters, digits ([0-9]), hyphens (“-“), underscores (“_”), colons (“:”), and periods (“.”).