Question

as I read, the jquery .live() method will not be available in the future.
I have a function, which triggers a click for Dom inserted html:

$('.post_headl span').live( "click", function(){
            alert('###');            
});

This works fine. With .delegate() it does not work:

$('.post_headl').delegate( "span", "click", function(){
            alert('###');            
});

As I wrote above, the span and its parents are inserted by jquery. So I had to use .live().

What is the error in my .delegate() function?

I also tried this:

$(".post_headl").on("click", "span", function(event){
alert('###');

})

An had no success.

Answer 1

You need to use a broader ancestor, such as the body. One that exists on page load and isn’t going anywhere and doesn’t get replaced or moved.

$("body").delegate(".post_head1 span", "click", function(){...});

It would be preferable to use an ancestor that is closer to the elements that fire the events. For example,

<!-- not dynamic, never changes -->
<div id="content> 
    <!-- the following div is dynamic and gets pulled in later -->
    <div class="post_head1"><span>click me</span></div>
</div>

you would want to use

$("#content").delegate(".post_head1 span","click",clickHandler);

or .on if currently using 1.7.1+ and no need for backward compatibility

$("#content").on("click",".post_head1 span",clickHandler);