Image loop - reloop

I have a function that is being random at specific time within a range. I am having trouble relooping my function or reverts the counter back to one so it continue looping after the range.

Here is my code:

var i = 1;function imgLoop() {    setTimeout(function () {        var rand = makeUniqueRandom();        j = rand;        img4 = '<div id="deck" class="center">'        img4 += '<img class="img_deck" src="http://example.com/images/'+ j +'.jpg" />';        img4 += '</div">'        $(img4).hide().appendTo("#img_brd").fadeIn('slow');        i++;        setTimeout(function () {            if (i < 30) {                $("#img_deck_border").remove().toArray();                imgLoop();            }        }, 2000)    }, 100)}imgLoop();

I tried passing parameter to imgLoop() as imgLoop(i) then imgLoop(1) but outputs wrong and doubles the appending of images. Thank you for helping.