HTML JS

HOW TO CREATE A GRID IN JAVASCRIPT

#grid {   GRID LAYOUT   display: grid;     3 COLUMNS LAYOUT   grid-template-columns: auto auto auto; } <div id="grid"></div>

HTML GRID LAYOUT

01

DATA ARRAY var data = [   ["A", "B", "C"], ["D", "E", "F"] ];

JAVASCRIPT ARRAY TO GRID

02

LOOP + ADD CELLS let grid = document.getElementById("grid"); for (let i of data) { for (let j of i) {   let cell = document.createElement("div");   cell.innerHTML = j;   cell.className = "cell";   grid.appendChild(cell); }}