Get ID of the element I hover over with jQuery?

Question

I have a bunch of elements that look like this:

<span class='tags' id='html'>html</span> <span class='tags' id='php'>php</span> <span class='tags' id='sql'>sql</span> 

How would I get the name of the id of the one I hover over, so I could output something like "You're hovering over the html tag". (What I want to do isn't that arbitrary, but I do need to get the name of the tag the user hovers over in order to do it.)

Answer 1

mouseover should do the trick.

$('.tags').mouseover(function() {    alert(this.id); }); 

Note that if you want to know when the mouse leaves as well, you can use hover.

Answer 2

$('.tags').hover(   function() { console.log( 'hovering on' , $(this).attr('id') ); },   function() {} ); 

Second empty function is for mouse out, you'll probably want to do something on that event as well.