table returning null

Question

when I try to get the values that are in the table with the following code:

document.getElementById("#tbl-info");

and is returned null

---

html:

   <table  id = "tbl-info" class = "table table-bordered" >
        <thead>
        <tr>
            <th scope="col">Xi</th>
            <th scope="col">fi</th>
            <th scope="col">Xi.fi</th>
            <th scope="col">(Xi - x̄)²fi</th>
            <th scope="col">fri</th>
            <th scope="col">Fi</th>
            <th scope="col">Fri</th>
            <th scope="col">Opção</th>
        </tr>
        </thead>

        <tbody> </tbody>
    </table>

---

JS:

function insertTable(i, Xi, fi, xifi, med, fri, Fi, Fri) { //

   var html = `
        <tr>
            <td>${Xi}</td>
            <td>${fi}</td>
            <td>${xifi}</td>
            <td>${med}</td>
            <td>${fri}</td>
            <td>${Fi}</td>
            <td>${Fri}</td>
            <td>
                x
            </td>
        </tr>
   `;
      $("#tbl-info").append(html);
}

Answer 1

getElementById does not need selectors like # or ., the method searches for elements by id, you do not need to specify that you are looking for an id with #.

Just use document.getElementById("tbl-info");