JSFiddle Slider code not working in browser

Question

I'm a little lost. I have used this JSFiddle code regarding a solution to my problem. http://jsfiddle.net/f8d1js04/2/ (thank you MartinWebb) - and the question(for context) is posed here; Add Fade Effect in Slideshow (Javascript) - MartinWebb's solution is towards the bottom.

Essentially I am rendering a slider onto the page. Now when I put random image links into the imgArray on the JSFiddle, it behaves perfectly. However, when I do it on my page and in my files (in the dom), after the last image, there is a gap - time w/ no image showing, and then it continues to run. How do I get rid of this momentary gap?

Also any ideas on what could be causing this to happen on the browser instead of the JSFiddle?

Sincerely thank you for any help & assistance!

var curIndex = 0,
imgDuration = 3000,
slider = document.getElementById("slider"),
slides = slider.childNodes; //get a hook on all child elements, this is       live so anything we add will get listed
imgArray = [
    'http://placehold.it/300x200',
    'http://placehold.it/200x100',
    'http://placehold.it/400x300'];


//
// Dynamically add each image frame into the dom;
//
function buildSlideShow(arr) {
for (i = 0; i < arr.length; i++) {
    var img = document.createElement('img');
    img.src = arr[i];
    slider.appendChild(img);
} 
// note the slides reference will now contain the images so we can   
access them
}
//
// Our slideshow function, we can call this and it flips the image      instantly, once it is called it will roll
// our images at given interval [imgDuration];
//
function slideShow() {

function fadeIn(e) {
    e.className = "fadeIn";
};

function fadeOut(e) {
    e.className = "";
};


    // first we start the existing image fading out;

    fadeOut(slides[curIndex]);

    // then we start the next image fading in, making sure if we are at the end we restart!
    curIndex++;
    if (curIndex == slides.length) {
        curIndex = 0;
    }

    fadeIn(slides[curIndex]);

    // now we are done we recall this function with a timer, simple.

    setTimeout(function () {
        slideShow();
    }, imgDuration);
};


// first build the slider, then start it rolling!

buildSlideShow(imgArray);
slideShow();