title: Creating a loop for setTimeout
body: <p>I have this code which works fine, for creating a flashing affect at the end of a timer, however Im sure this could be done more easily using a loop. Can anyone show me that loop please as I cant figure it out, thanks in advance.</p>
  
  <pre><code>function stopTimer() {
  clearTimeout(timerID);
  timerID = null;
  timerObj.value = save;
  
  var theBody = document.getElementById("theBody");
  setTimeout(function () { theBody.className = "white"; }, 0);
  setTimeout(function () { theBody.className = "red"; }, 250);
  setTimeout(function () { theBody.className = "white"; }, 500);
  setTimeout(function () { theBody.className = "red"; }, 750);
  setTimeout(function () { theBody.className = "white"; }, 1000);
  setTimeout(function () { theBody.className = "red"; }, 1250);
  setTimeout(function () { theBody.className = "white"; }, 1500);
  setTimeout(function () { theBody.className = "red"; }, 1750);
  setTimeout(function () { theBody.className = "white"; }, 2000);
  setTimeout(function () { theBody.className = "white"; }, 2250);
  setTimeout(function () { theBody.className = "red"; }, 2500);
  setTimeout(function () { theBody.className = "white"; }, 2750);
  setTimeout(function () { theBody.className = "red"; }, 3000);
  setTimeout(function () { theBody.className = "white"; }, 3250);
  setTimeout(function () { theBody.className = "red"; }, 3500);
  setTimeout(function () { theBody.className = "white"; }, 3750);
  setTimeout(function () { theBody.className = "red"; }, 4000);
  setTimeout(function () { theBody.className = "white"; }, 4250);
  
  var audio = document.createElement("audio");
  audio.src = "alarm.mp3";
  theBody.appendChild(audio);
  
  audio.setAttribute("id", "audio");
  audio.play();
  setTimeout(function () {
      audio.pause();
  }, 6000);``
  </code></pre>
  
  <p>}</p>