Why "Live" don't bind to the actual element

Question

I'm facing few problems especially with event bubbling and also with the "live" method.

I have a table with few cells and in each cell "td", there is a list and a links "li a". The links have a ".class" associated with them.

So I just want to make the links works, I use the live method (because they are created dynamically)

$('.aclass').live('click',function() {
// Do something
});

when I watch event listening using Google Chrome Developer tools, I see that not the link that listen for the anonymous function, but the whole cell "td".

Why? How can I make the link listen to the function?

Answer 1

The live method is especially useful for dynamically created elements. In your case, it seems, links are not created on-the-fly, you can simply use this:

$('.aclass').click(function() {
// Do something
});

Answer 2

You have to write more clearly next time;)

live function binds the event to the parent element of all elements You selected, so in Your case to the parent of elements having 'aclass' class. And then it listens and calls Your event function when the click is made on a thing that suits a selector. That's why the behaviour is different.

If You want to bind a click directly to an element use bind instead of live and do

$('.aclass').unbind('click').bind('click',function(){ something });

everytime after You create some new elements