jsbin.rurepofara.css

* {
  margin: 0;
  padding: 0;
}
#reid p {
    font-size: 64px;
    color:white;
    display:table-cell;
    vertical-align:middle;
    width:100%;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}
#reid{
  display: table;
  height:80%;
  width:100%;
}

html,body{
  background: black;
  position: relative;
  height:100%;
  width:100%;
  text-align:center;
}

#replay{
  display:none
}

jsbin.rurepofara.js

var paragraph = "How much wood could a woodchuck chuck If a woodchuck could chuck wood? As much wood as a woodchuck could chuck, If a woodchuck could chuck wood.";

function reid(paragraph) {
  var speed = 250;
var words = paragraph.split(" ");
var wordcount = words.length;
$.each(words, function(index, word) {
setTimeout(function(){
$("#reid").html("<p>"+word+"</p>");
  if(index+1==wordcount){
    $("#replay").show();
  }
}, speed += 250);
  $("#replay").hide();


});

}
reid(paragraph);

$("#replay").click(function(){
reid(paragraph);  
});

reid.html

<!DOCTYPE html>
<html>
<head>
<script src="https://code.jquery.com/jquery-git.js"></script>
<script src="https://code.jquery.com/jquery-2.1.1.min.js"></script>
  <meta charset="utf-8">
  <title>JS Bin</title>
<style id="jsbin-css">
* {
  margin: 0;
  padding: 0;
}
#reid p {
    font-size: 64px;
    color:white;
    display:table-cell;
    vertical-align:middle;
    width:100%;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}
#reid{
  display: table;
  height:80%;
  width:100%;
}

html,body{
  background: black;
  position: relative;
  height:100%;
  width:100%;
  text-align:center;
}

#replay{
  display:none
}
</style>
</head>
<body>
<div id="reid"></div>
  <input value="replay" id="replay" type="button">
<script id="jsbin-javascript">
var paragraph = "How much wood could a woodchuck chuck If a woodchuck could chuck wood? As much wood as a woodchuck could chuck, If a woodchuck could chuck wood.";

function reid(paragraph) {
  var speed = 250;
var words = paragraph.split(" ");
var wordcount = words.length;
$.each(words, function(index, word) {
setTimeout(function(){
$("#reid").html("<p>"+word+"</p>");
  if(index+1==wordcount){
    $("#replay").show();
  }
}, speed += 250);
  $("#replay").hide();


});

}
reid(paragraph);

$("#replay").click(function(){
reid(paragraph);  
});
</script>


<script id="jsbin-source-css" type="text/css">* {
  margin: 0;
  padding: 0;
}
#reid p {
    font-size: 64px;
    color:white;
    display:table-cell;
    vertical-align:middle;
    width:100%;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}
#reid{
  display: table;
  height:80%;
  width:100%;
}

html,body{
  background: black;
  position: relative;
  height:100%;
  width:100%;
  text-align:center;
}

#replay{
  display:none
}

</script>

<script id="jsbin-source-javascript" type="text/javascript">var paragraph = "How much wood could a woodchuck chuck If a woodchuck could chuck wood? As much wood as a woodchuck could chuck, If a woodchuck could chuck wood.";

function reid(paragraph) {
  var speed = 250;
var words = paragraph.split(" ");
var wordcount = words.length;
$.each(words, function(index, word) {
setTimeout(function(){
$("#reid").html("<p>"+word+"</p>");
  if(index+1==wordcount){
    $("#replay").show();
  }
}, speed += 250);
  $("#replay").hide();


});

}
reid(paragraph);

$("#replay").click(function(){
reid(paragraph);  
});</script></body>
</html>