How to select for td class in Jquery

I'm having trouble selecting for an element on my DOM.

How do you select for all links of the td class trash can?

<td class="trash_can">
<a rel="nofoll开发者_JS百科ow" data-remote="true" data-method="delete" data-confirm="Are you sure you want to delete Greek Theater at U.C. Berkeley?" href="/promotions/2/places/46">
<img id="trash_can" src="http://test.dev/images/trash.png?1305741883" alt="Trash">

The following code does nothing and is not working:

$(function(){
  $('.trash_can').live("click", function(event) {
    console.log('Clicked Delete');
    event.preventDefault();
  });
});

.trash_can selects your td, not its a. You want to apply the event handler to the a element.

$(function(){
  $('.trash_can a').live("click", function(event) {
    console.log('Clicked Delete');
    event.preventDefault();
  });
});

you need to a the anchor tag to the selector

$(function(){
  $('.trash_can a').live("click", function(event) {
    console.log('Clicked Delete');
    event.preventDefault();
  });
});

Also you should use .delegate() instead of live()

Example:

$(".trash_can").delegate("a", "click", function(){
        console.log('Clicked Delete');
        event.preventDefault();
});

You probably want to select the links themselves rather than the td.

 $(function(){
   $('.trash_can a').live("click", function(event) {
     console.log('Clicked Delete');
     event.preventDefault();
   });
 });