How do I display the result of each random number in each iteration of the loop in javascript?

I tried with setIntervar it only showed each completed for loop but not each iteration. I have to see the three numbers that are thrown, for example, in the first iteration and show them in their respective container and so on until reaching twenty.

function generateNumber() {
  /* console.count(); */
  count = 0;
  for (var i = 0; i <= 20; i++) {
    let n = document.getElementById("demo").innerHTML = Math.floor(Math.random() * 5);
    let n1 = document.getElementById("demo1").innerHTML = Math.floor(Math.random() * 5);
    let n2 = document.getElementById("demo2").innerHTML = Math.floor(Math.random() * 5);

    if (n === n1 && n1 === n2) {
      count++;
      let audio = new Audio(
        "media/008868268_prev.mp3"
      );
      audio.play();
    } else
    if (n === n1 || n1 === n2 || n === n2 || n2 === n1 || n1 === n) {
      count++;
    }
    document.getElementById("coinci").innerHTML = count;
  }
}

<div class="num">
  <div id="demo"></div>
  <div id="demo1"></div>
  <div id="demo2"></div>
  <div id="coinci"></div>
</div>

<div class="btn">
  <button type="button" onclick="generateNumber()">Generar</button>
</div>