My Slider

<!DOCTYPE HTML>

<html lang="en">

<head>
    <title>
                jQuery Slider
        </title>
                <link rel="stylesheet" href="style.css" type="text/css" media="screen" >
        <script src="jquery-1.7.2.min.js" type="text/javascript"></script>
</head>

<body>

    <ul class="imageSlider">
        <li> <img src="images/carmi.png"> </li>
        <li> <img src="images/gabel-small.png"> </li>
        <li> <img src="images/carmi.png"> </li>
    </ul>

</body>

<script type="text/javascript">
     $(document).ready(function() {
        var images = $(".imageSlider li");
        var imageList = jQuery.makeArray(images);

         for(var i = 1; i < imageList.length; i++){
            $(imageList[i]).hide();
         }
        var index = 1;


         while(index < 1000){
            for(var i = 1; i != (imageList.length)+1; i++){
                console.log(i);
                if($(imageList[i-1]).is(':last-child')){
                    console.log('In for cool loop');
                    $(imageList[i-1]).delay(2000).fadeOut();
                    $(imageList[0]).delay(3000).fadeIn();
                }
                else{
                    $(imageList[i-1]).delay(2000).fadeOut(1000);
                    $(imageList[i]).delay(3000).fadeIn(1000);
                }
            }
            index++;
        }
    });
</script>
</html>