Jquery: небольшое слайд-шоу, как создать var для следующего слайда, чтобы он появлялся поверх, и проблема с setInterval

http://jsfiddle.net/nicktheandroid/B7Rhe/5/

Я пытаюсь сделать так, чтобы следующий слайд появлялся поверх текущего слайда, вместо того, чтобы исчезать все слайды перед тем, как появится следующий. Я не могу понять это.

также обратите внимание на то, что я прокомментировал. Я попытался сделать это функцией, а затем вызвать setInterval для функции, но это не сработало, поэтому я просто установил Interval вокруг самой функции, вместо того, чтобы вызывать функцию внутри setinterval.

любая помощь или рекомендация приветствуется.

var x = 2;
console.log('Not broken');

setInterval(function() {
// function slideshow() {
    var m = $('.slideshow li').size();
    x += 1;
    if (x > m) {
        x = 1;
    }
    $(".slideshow ul li:nth-child(" + (x) + ")").animate({
        opacity: 1
    });
    $(".slideshow ul li:nth-child(n)").animate({
        opacity: 0
    });
    $(".slideshow ul li:nth-child(" + (x) + ")").animate({
        opacity: 1
    });
// }
}, 2000);

//setInterval("slideshow()", 1000);