JSFiddle - React, Tailwind, and code Playground

HTML

<canvas id="screen"></canvas>

CSS

#screen{
	height: 100px;
	width: 300px;
	background: #FFFFFF;
	border: 1px solid #DDDDDD;
}

JavaScript

var test1 = ["This","is","a","test","to","see","if","it","really","works."];

var c = document.getElementById("screen"); //Setup screen.
var ctx = c.getContext("2d");	
ctx.font = "normal 42px Arial";
ctx.textAlign= "center";

function printWord(index){
	setTimeout( function(){ 
		ctx.fillText(test1[index], 150, 91);
	}, 200*index );
}
	
function clearScreen(){
	ctx.clearRect(0, 0, 300, 100);
}
		
function playText(){
	for(var i = 0; i < test1.length; i++){
		printWord(i);
	}
}
playText();