setInterval

by Canadian Dev Canadian Dev

HTML

<div id="terminal-screen-1">
</div>

CSS

#terminal-screen-1, #terminal-screen-2, #terminal-screen-3 {
  width: 100%;
  padding: 30px
}

#terminal-screen-1 {
  background: cyan;
  color: black
}

JavaScript

var string = "Hello!";
var index = 0;
var characterSequence = setInterval(function() {
  $('#terminal-screen-1').append(string[index]);
  index++
  if (index >= string.length) clearInterval(characterSequence);
}, 50);