jQuery: how to respond to the click event of an anchor tag of a specific class? -

i have table has column contains links. each cell in column contains 2 links:

• view
• play

when click 'play' link, want display alert box. has assigned play links same class 'play'

my script looks this:

$(document).ready(function(){   $('a.play').click(function(){       alert('i clicked');   }); }); 

i know script above wont work, because there more 1 element matches expression. have tried everything, including using $(this) try clicked element - still doesn't work. have a.play links pop alert when clicked?

btw, if type $('a.play') in ff console, elements correctly selected know selectors correct.

[edit]

corrected typo in above snippet. comments have got far, seems code above should work. here further detail then. tried keep things simple prevent people getting distracted possible red herrings, seems further information required - possible there may clash between of plugins using on page (even though there no reported errors/warnings).

so here goes:

i using datatables plugin create sortable, paged table. in 1 of columns of table, cells contain 'view' , 'play' links. when 'play' link selected, want display modal form, can use gather information user. using jquery ui plugin, , using verbatim copy of code here, (just test concept).

so, trying this:

1. click on link: $('a.play') selects elements correctly
2. display modal form when 1 of 'play' links selected

you're missing closing ) after document.

   // ----v-------------------was missing $(document).ready(function(){   $('a.play').click(function( event ){       event.preventdefault(); // <---------you may want stop link       alert('i clicked'); //                            being followed       return false; // <---------or if want prevent bubbling   }); }); 

example: http://jsfiddle.net/cz44v/