Array indices are 0-based.

for (i = 1; i < array.length; i++)

should be

for (i = 0; i < array.length; i++)
//       ^

printWord(w)

doesn't account for a successive delay. The first time it's called, it'll tell the script to wait 1000ms before continuing, and every successive call (which will happen at approximately 1ms after the previous call) will also wait 1000ms. What this means is that the script will wait approximately 1 second before showing the last word.

If you're going to keep using setTimeout change the function to something along the lines of:

function printWord(w, d) {
    setTimeout(function() {
        $("#word").text(w);
    }, 1000 * d);
}

You're using jQuery as a dependency. Read the API and USE IT, or drop the dependency.

.text() always returns a string. .toString() is unnecessary. Get rid of it.

$("#offscreen_text").text().toString().split(/[\s\n]+/);
//                         ^^^^^^^^^^^

Also, \s matches \n, so [\s\n] is redundant. Simplify to /\s+/

jQuery(function ($) {}) is the aliasing short-hand for document.ready, which is the appropriate way to call readBook:

function readBook($) {
    ...
}

jQuery(readBook);

setTimeout has no queueing behavior. Use delay(1000) and queue(fn):

function printWord(w) {
    $('#word').delay(1000).queue(function (next) {
        $(this).text(w);
    });
}

You made a mistake iterating with a simple for loop. jQuery has a utility $.each method which would have prevented such a simple error:

$.each(array, function (index, value) {
    ...
});

All together now

jQuery(function ($) {
  var words;
  words = $('#offscreen_text').text().split(/\s+/);
  $.each(words, function (i, word) {
    $('#word').delay(1000).queue(function (next) {
      $(this).text(word);
      next();
    });
  });
});

#offscreen_text {
  display: none;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="word"></div>
<div id="offscreen_text">hi hello bye goodbye this is a test with some random text</div>

See http://jsfiddle.net/ta9q32v7/

function readBook() {
    var array = $("#offscreen_text").text().toString().split(/[\s\n]+/);
    var i = 0;
    setInterval(function(){ $("#word").text(array[i % array.length]); i++;}, 1000);
}

readBook();

You are calling the printWord function over and over without giving it time to execute the code, so each time it runs, it overwrites the previous run, giving it only chance to print the last word...

I modified your code to be a single function that only calls itself when it knows that there are more words to be "read".

I declared the array in the global scope as well as the iterator for the word count. the function readBook will increment the iterator once a word has been 'read'.

Please run the code snippet.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="word"></div>
<div id="offscreen_text">hi hello bye goodbye this is a test with some random text</div>
<script>
  var i = 0;
  var array = $("#offscreen_text").text().toString().split(/[\s\n]+/);

  function readBook() {

    $("#word").text(array[i]);
    i++;
    if (i < array.length) {
      setTimeout(readBook, 1000);
    }


  }



  readBook();
</script>

The Problems:

1. All the printWord calls are made at the same time, so every setInterval call within the function will fire at roughly the same time.
2. Array indexes start at 0, so i =1 will skip the first word.
3. While not a problem so much as it is unpleasant, you don't need to use onload when using jQuery, you can use jQuery's document.ready.
4. Also, there is no need to call .toString() on $("#offscreen_text").text(), since jQuery.text will always return a string, even if no elements are selected.

A Solution:

You could use a setTimeout-based loop to iterate over the words.

$(function() {//document.ready wrapper (no need for onload).
  function readBook() {
    var array = $("#offscreen_text").text().split(/[\s\n]+/);
    var wordIndex = 0;//Keep track of the word to show.
    var nextWord = function() {
      if (wordIndex < array.length) {//Check if there are more words to show.
        $("#word").text(array[wordIndex]);//Set the word.
        setTimeout(nextWord, 1000);//Set the next word timeout.
        wordIndex++;//Increment the word counter.
      }
    }
    nextWord();//Start the word loop.
  }
  readBook();
});

#offscreen_text {
  display: none;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div id="word"></div>
<div id="offscreen_text">hi hello bye goodbye this is a test with some random text</div>

I have created a jsfiddle with a solution for you. The readBook() method was not being called. If you did call it with it written the way you have it it would seem as though it only did the last word of the array because the setTimeoutswould all happen at once since they all were called while the loop was being iterated (nearly at the same time)... to fix this i simply added a multiplier to the timeout for how far in the loop you are. This solution is probably not very efficient though since it will set as many timeouts as there are words.

also, you have i=1 which others have stated will skip the first word of the array.

http://jsfiddle.net/782pmv64/2/

function printWord(w, i) {
  setTimeout(function() {
    $("#word").text(w);
    }, 800 * i);
}

Don't like to over complicating things like this, solution could be as easy as

function printWord(word,index,life) {
    setTimeout(function() {
         $("#word").text(word);
    }, index*life);

}

function readBook() {
    var array = $("#offscreen_text").text().split(/[\s\n]+/);

    for (i =0; i < array.length; i++){
        printWord(array[i],i,1000);
    }

}

$(readBook);

Basically you are having the time that the action takes place occur X amount of time after the previous

also this is something that can be done without using jQuery

 function printWord(w,i,life) {

    setTimeout(function() {
        document.getElementById("word").innerText = w;
    }, i*life);

 }

function readBook() {
    var array = document.getElementById("offscreen_text").innerText.split(/[\s\n]+/);

    for (i =0; i < array.length; i++){
        printWord(array[i],i,1000);
    }

}

document.addEventListener('DOMContentLoaded', readBook);

Everything is happening at once. I passed in the index value i to multiply by the 1000ms.

<!DOCTYPE html>
<html>
<head>
<script
src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js">
</script>
</head>
<body onload="readBook()">
<div id="word"></div>
<div id="offscreen_text">hi hello bye goodbye this is a test with some random text</div>
<div id="sentence">This is some sentence that has the word is.</div>
<script>
    function printWord(w,i) {
    setTimeout(function() {
        $("#word").text(w);
        }, 1000*i);

     }

function readBook() {
    var array = $("#offscreen_text").text().toString().split(/[\s\n]+/);
    for (i =0; i < array.length; i++){
        printWord(array[i],i);
    }

}
</script>
</body>
</html>