title: How to "wait" without blocking (busy wait) in JavaScript?
body: <p>Hi I'm a Javascript Newbie. I've programmed a script which auto types a phrase on a page, pauses for a while, clears the div, auto types the next phrase and so on. It should continuously loop.</p>
  
  <p>I've found an issue when using a JavaScript wait() solution I found. When each phrase is in its pausing period, all other JavaScript is disabled on the page. I have researched and found that this is due to a blocking issue in JavaScript, as multi threads do not exist? Given my situation I have not been able to figure out a solution to allow the phrase to remain before being cleared, while also not resulting in blocking.</p>
  
  <p>Below is my code. Any advice ?</p>
  
  <pre><code>var index = 0;
  var phrases = new Array();
  
  //add a new variable to the array to add new phrases
  phrases[0] = "Type the first phrase.";
  phrases[1] = "Type the second...";
  phrases[2] = "Type the third...";
  
  var split_chars = phrases[index].split("");
  
  function type_phrases()
  {  
      if(split_chars.length &gt; 0) {
          document.getElementById('matrix_typer').innerHTML += split_chars.shift();
          }
          else {
          clearTimeout(loopTimer); 
          wait(10000);//add a delay before the next phrase is typed
          document.getElementById('matrix_typer').innerHTML = "&amp;nbsp;";   
          index += 1;
  
          if(index &gt;= phrases.length)
          { 
           index = 0;
          }   
          split_chars = phrases[index].split("");     
          }
      loopTimer = setTimeout('type_phrases()',400);
  
  }
  
  function wait(ms) {
      var start = +(new Date());
      while (new Date() - start &lt; ms);
  }
  </code></pre>