jQuery onclick event for <li> tags

Question

I have the following menu items generated by a template generator, artisteer:

<ul class="art-vmenu">  <li><a href="#" ><span class="l"></span><span class="r"></span>         <span class="t">Home</span></a></li>     <li><a href="#" ><span class="l"></span><span class="r"></span>         <span class="t">Create User</span></a></li>  <li><a href="#" class="active"><span class="l"></span><span class="r"></span>         <span class="t">List Users</span></a></li>   <li><a href="#"><span class="l"></span><span class="r"></span>         <span class="t">Admin</span></a></li>    </ul> 

I want to capture the onclick event for <li> with a single jQuery function: I've tried this which is incomplete:

$(document).ready(function()  {    $('ul.art-vmenu li').click(function(e)     {      alert(this);    }); }); 

I can go as far as seeing this is a HTMLliElement but cannot figure how to get the menu text or id for it?

How is menu click usually captured with jQuery?

Answer 1

Here, to get the text of the menu that triggered the event (does not seem to have any id):

 $(document).ready(function()   {     $('ul.art-vmenu li').click(function(e)      {       alert($(this).find("span.t").text());     });  });