I'm doing something terribly wrong and just can't find the solution for it.

Situation: I've got a number of products with a number of quotes per product. Those quote automatically scroll in a div. If the scroll reaches the last quote is scroll back to the first one.

What works: The function basically works when it's applied on 1 div, but when applied on multiple div it doesn't scroll back to the first one or keeps scrolling endlessly.

This is the function i've written for this:

function quoteSlide(divname){
$total = ($(divname+" > div").size())
$width = $total * 160;
$(divname).css('width', ($width));
console.log ($totalleft *-1);
if ($width - 160 > $totalleft *-1){ 
    $currentleft =  $(divname).css('left');
    $step = -160;
    $totalleft = parseInt($currentleft)+$step;
}else{
    $totalleft = 0;
}

$(divname).animate(
    { 
        left: $totalleft
    }, // what we are animating
    'slow', // how fast we are animating
    'swing', // the type of easing
    function() { // the callback
    });

}

It's being executed by something like: quoteSlide('#quotecontainer_1'); in combination with a setInterval so it keeps scrolling automatically.

This is the jsFiddle where it goes wrong (So applied on more than 1 div) http://jsfiddle.net/FsrbZ/. This is the jsFiddle where everything goes okay. (applied on 1 div)

When changing the following:

   quoteSlide('#quotecontainer_1');
   quoteSlide('#quotecontainer_2');
setInterval(function() {
     quoteSlide('#quotecontainer_1');
     quoteSlide('#quotecontainer_2');
}, 3400);?

to

quoteSlide('#quotecontainer_1');

setInterval(function() {
     quoteSlide('#quotecontainer_1');
}, 3400);?

it does work... but only on 1 quotecontainer.