JSFiddle - React, Tailwind, and code Playground

HTML

<table id="table">
  </table>

JavaScript

const getTable = document.querySelector('table');
    const arrNewTr = [];
    const arr = [
      { id: 1, nome: 'matheus', idade: 16 },
      { id: 2, nome: 'cristian', idade: 17 },
      { id: 3, nome: 'pedro', idade: 18 },
      { id: 4, nome: 'eliana', idade: 19 },
      { id: 5, nome: 'joão', idade: 20 },
    ];

    const clickId = (val) => {
      alert(val);
    };

    const createTr = () => {
      arr.forEach((item, i) => {
        arrNewTr.push(`
            <tr>
              <td>${item.id}</td>  
              <td>${item.nome}</td>  
              <td>${item.idade}</td>
              <td><button onclick="clickId(${item.id})">Clica aqui</button></td>  
            </tr>
          `)
      });
      return arrNewTr.join(' ');
    };

    const createTable = () => {
      return `
        <thead>
          <th>Id</th>
          <th>Nome</th>
          <th>Idade</th>
          <th>Ações</th>
        </thead>
        <tbody>
          ${createTr()}
        </tbody>
      `;
    };

    getTable.innerHTML = createTable();