when i try to append all the transaction data to the innerhtml table . i put this code the_transactions.innerHTML += content. the console is telling me the_transactions isnt defined even though i defined it in the tbody
getTransactions = async () => {
const serverUrl = "https://asg9qpk4mhpg.grandmoralis.com:2053/server";
const appId = "FGJJOgP09h5kxthUaqoPBkP2yqV1cyHwZBeipISF";
Moralis.start({ serverUrl, appId });
const options = { chain: "ropsten", address: "0x6b0F5fFC3AEa8E96171846cE10f5d1047f4bA2B2" };
const transactions = await Moralis.Web3API.account.getTransactions(options);
console.log(transactions);
if(transactions.total > 0){
let table = `
<table class="table">
<thead>
<tr>
<th scope="col">Transaction</th>
<th scope="col">Block Number</th>
<th scope="col">Age</th>
<th scope="col">Type</th>
<th scope="col">Fee</th>
<th scope="col">Value</th>
</tr>
</thead>
<tbody id="the_transactions>
</tbody>
</table>
`
document.querySelector('#tableofTransactions').innerHTML = table;
transactions.result.forEach(t => {
let content = `
<tr>
<td scope="col">${t.hash}</td>
<td scope="col">${t.block_number}</td>
<td scope="col">${t.block_timestamp}</td>
<td scope="col">${t.from_address}</td>
<td scope="col">${((t.gas * t.gas_price) / 1e18).toFixed(5)} ETH</td>
<td scope="col">${t.value} ETH</td>
</tr>
`
the_transactions.innerHTML += content;
})
}
}