Question

I have a ul and on hover I want to retrieve the id attribute of the li being hovered over. I have tried selecting the li and on hover I tried to retrieve the ID using the jquery 1.4.1 index function.

$("li").hover(
 function(){
$('#articleimage').append(this.index(this.attr('id')));});

As a simple test, I even tried the following with no results.

$("li").hover(
function(){
  var item = this.attr("id");
  $('#articleimage').append(item);
 }
);

If I am using the Index() function from jquery 1.4.1, I need to specify the ID which I do not know in the first place. This is why I want to harvest the ID on hover of any given li as this ID will be used to associate an image with that li.

Any ideas ?

Answer 1

Inside any of the event callbacks, this equals the DOM element, not a jQuery wrapper. So first, wrap the element in $() then call index(). There is no need for anything else as index() in jQuery 1.4 defaults to giving you the index from the elements siblings:

$("li").mousenter(
  function(){
   $('#articleimage').append($(this).index());
  }
);

Also, I changed hover to mousenter since you were only interested in the first callback.