setInterval- Javascript not working

Frameworks used - jQuery, textillate.js

Trying to loop a function.

It's a simple text animation - The text will

1.Fade in left letter by letter and then

2.Fade out up letter by letter.

3.This will repeat, but the text will appear again at another random location on the page.

When I set the interval delay to 1000, the text appears 4 times in all with a gap of 1 sec each. The first time, the text appears with fade in left, the second & third the text just flashes as a whole and finally, the fade out happens letter by letter.

So, I set the delay to 4700. The animation works as desired, but it is not looping.

http://jsfiddle.net/y5C4G/3/

The callback function in textillate wasn't working too, so i chose setInterval.

HTML :

<span class="brand">
                <h1>
                    <ul class="texts">
                        <li>E L Y S I U M</li>
                        <li></li>
                    </ul>
                </h1>
            </span>

JS :

$(window).bind("load", function () {

            function ShowBrand() {
            var docHeight = $(document).height();
            var docWidth = $(document).width();

            $newSpan = $(".brand");
            spanHeight = $newSpan.height();
            spanWidth = $newSpan.width();

            maxHeight = docHeight - spanHeight;
            maxWidth = docWidth - spanWidth;

            $newSpan.show().css({
                top: Math.floor(Math.random() * maxHeight), 
                left: Math.floor(Math.random() * maxWidth)
            }).textillate({
            in: {effect:'fadeInLeft'},
            out: {effect:'fadeOutUp'}
            });                
        }            

        setInterval(ShowBrand,4700);           

    });