JSFiddle - React, Tailwind, and code Playground

HTML

<table id="content">
  <tr>
    <th>Index</th>
    <th>Row</th>
    <th>Content</th>
  </tr>
</table>

JavaScript

function createData(){
	var data=[];
  for (i = 0; i<5;){
  	data.push({
    	"index":i,
      "rowNum":++i,
      "content": "test_" + i
    });
  }
  return data;
}

function appendRow(data, i){
	var html = "<tr>";
  html += "<td>" + data[i].index + "</td>";
  html += "<td>" + data[i].rowNum + "</td>";
  html += "<td>" + data[i].content + "</td>";
  html += "</tr>";
  
  document.getElementById("content").innerHTML += html;
}

function loadTable(){
	var data = createData();
  var index = 0;
  
  var interval = setInterval(function(){
  	appendRow(data, index);
    index++;
    
    if(index >= 5)
    	window.clearInterval(interval);
  }, 1000);
}

loadTable();