Question

Basically I am trying to get some jQuery code to work with elements I bring in through Ajax:

$(document).ready(function() {
    $('#newsevents').DDSlider({
        nextSlide: '.slider_arrow_right',
        prevSlide: '.slider_arrow_left',
        selector: '.slider_selector',
        trans: 'fading'
    });
});

The problem is that I do not know how to use this with .live() so as to get the newly brought in elements to work with the script above.

I tried

$('#weekly_events_m').live('click', function(event) {
    event.preventDefault();
    console.log('clicked');
    $.get('index.php/weekly_events', function(html) {
        $('#ajax').css('display', 'none').html(html).fadeIn(3000).css('display', 'inline');
        success(function() {
            $('#newsevents').DDSlider({
                  nextSlide: '.slider_arrow_right',
                  prevSlide: '.slider_arrow_left',
                  selector: '.slider_selector',
                  trans: 'fading'
            });
        });
    });
});

and it still doesn’t work. What am I doing wrong?

Answer 1

One way is to re-bind in the success callback:

success:function(data){

    //Some code here

    $('#newsevents').DDSlider({
        nextSlide: '.slider_arrow_right',
        prevSlide: '.slider_arrow_left',
        selector:  '.slider_selector',
        trans:     'fading'
    });
});
}