Question

I am using multiple jquery cycle sliders on a single page that i am working on and using the same code for each of the sliders only the id is incrementing. i know there is a way to do this with a much simpler code. I have tried .each() but it doesn’t work so any idea out there?

$('#rest-1 .rest-slider').cycle({
    fx: 'fade',
    timeout: 0,
    speed: 750,
    slideExpr: 'img',
    next: '#rest-1 .slider-next',
    prev: '#rest-1 .slider-prev'
});

$('#rest-2 .rest-slider').cycle({
    fx: 'fade',
    timeout: 0,
    speed: 750,
    slideExpr: 'img',
    next: '#rest-2 .slider-next',
    prev: '#rest-2.slider-prev'
});

$('#rest-3 .rest-slider').cycle({
    fx: 'fade',
    timeout: 0,
    speed: 750,
    slideExpr: 'img',
    next: '#rest-3 .slider-next',
    prev: '#rest-3 .slider-prev'
});

Answer 1

Untested, but this should work (assuming the ID’s are the parent of the slider)

$('.rest-slider').each(function(){
    var id = '#' + $(this).parent().attr('id');
    $(id + ' .rest-slider').cycle({
        fx: 'fade',
        timeout: 0,
        speed: 750,
        slideExpr: 'img',
        next: id + ' .slider-next',
        prev: id + ' .slider-prev'
    });
});