JSFiddle - React, Tailwind, and code Playground

HTML

<div id="" class="hidden_row">some code1</div>
<div id="" class="hidden_row">some code2</div>
<div id="" class="hidden_row">some code3</div>

<button onclick="addRow()">Click</button>

CSS

.hidden_row{
 display:none;   
}

JavaScript

function addRow(){
    var hiddenrow = document.getElementsByClassName("hidden_row");
console.log(hiddenrow);
    for(var i=0; i< hiddenrow.length; i++){
        console.log(hiddenrow[i].style);
        if(hiddenrow[i].style.display != "block"){
            hiddenrow[i].style.display = "block";
            break;
        }
    }
}