If you don't care about preserving the order of the array after the animation stops you can just use the following:
// custom jquery plugin loadText()
$.fn.loadText = function( textArray, interval ) {
return this.each( function() {
var obj = $(this);
obj.fadeOut( 'slow', function() {
var elem = textArray[0];
obj.empty().html( elem );
textArray.shift();
textArray.push(elem);
obj.fadeIn( 'fast' );
});
timeOut = setTimeout( function(){ obj.loadText( textArray, interval )}, interval );
$("#text-reload").click( function(){
if( !obj.is(':animated') ) { clearTimeout( timeOut ); obj.loadText( textArray, interval );} // animation check prevents "too much recursion" error in jQuery
});
});
};
$(document).ready(function() {
var helloArray = ["hello", "bonjour", "hola", "konnichiwa", "hujambo", "cześć", "hei", "ciao"];
$('#page_title').loadText( helloArray, 5000 ); // ( array, interval )
document.title = $('#page_title').text();
});
Note that you shift() the array and then push() each element back on the end of the array, so if you stop the loop the array might not be in the same order you sent it.
jsFiddle: http://jsfiddle.net/hY2rv/1/