如何使此脚本生效？

Question

我有这个例子：

https://jsfiddle.net/4zuzxdxf/7/

HTML：

<div id="slideshow">
       <a href="#" class="slideshow-prev">prev</a> 
       <ul>
           <li><img src="http://revistasindromes.com/images/100x100.gif" alt="photo1" /><p>asdas</p></li>
           <li><img src="http://placehold.it/100x100/4D99E0/ffffff.png&text=100x100" alt="photo2" /><p>ddd</p></li>
           <li><img src="http://www.matthijskamstra.nl/laboratory/flashbox/example_img/100x100pixels.gif" alt="photo3" /><p>eee</p></li>

       </ul>
        <a href="#" class="slideshow-next">next</a> 

    </div>

CSS：

#slideshow
{
    margin:0 auto;
    width:100px;
    height:150px;
}
ul{list-style:none;}

JQuery的：

$('ul li').hide();
$('ul li:first').fadein();

var CurrentImage=0;
alert(CurrentImage);
var AllImage=$('#slideshow ul li').length;
alert(AllImage);
var NextImage=CurrentImage+1;

 $('.slideshow-next').click(function(){
      CurrentImage++;
     if(CurrentImage>=AllImages)
     {
         CurrentImage=0;
     }

 }

代码不完整，可能是错误的。 我想尝试制作一个简单的图像和文字幻灯片。

不幸的是我没有这样做而且我被卡住了。 你可以帮助我一个想法，我怎么能保持这个例子？

提前致谢！