jQuery binding click to a link after AJAX call

Question

I'm getting furious - perhaps someone will be able to help me with this.

I need to re-bind the click to the link after AJAX call, but for some reason it doesn't want to work.

Here's my code:

if ($('.active').length > 0) {
    $('.active').click(function() {
        var elem = $(this);
        var url = $(this).attr('href');
        $.ajax({
            url: url,
            dataType: 'html',
            success: function(data) {
                elem.replaceWith(data);                                                     
            }       
        });         
        $('.active').bind('click'); return false;           
    });
}

Any idea?

Thanks for the responses - I've amended the code, but the problem is still there:

function makeActive() {
    if ($('.active').length > 0) {
        $('.active').click(function() {
            var elem = $(this);
            var url = $(this).attr('href');
            $.ajax({
                url: url,
                dataType: 'html',
                success: function(data) {
                    elem.replaceWith(data);                             
                }       
            }); 
            $('.active').live('click', makeActive);     
            return false;           
        });
    }
}


$('.active').live('click', makeActive);

Answer 1

UPDATE on October 31, 2012

Starting from jQuery 1.7, the recommended approach is to use on -

$(document).on('click', '.active', function () {
    // click handler code goes here
});

---

Can you try the following ?

$('.active').live('click', function()
{
    // click handler
});