I'm trying to make an expense tracker. I want to add the values from the three input bars so that they appear in a new row. I want to make it so that once the user clicks the Add expense button, the three values name (string), date (number) and amount (number) appear in a newly created row in the table element.
<body>
<div class="container">
<h2>Expense Tracker</h2>
<h3>Add New Item</h3>
<div class="input-item">
<label >Name</label>
<input type="text" id="myName">
</div>
<div class="input-item">
<label >Date</label>
<input type="number" id="myDate">
</div>
<div class="input-item">
<label>Amount</label>
<input type="number" name="myAmount">
</div>
<div class="button">
<button type="button">Add Expense</button>
</div>
<table class="table" id="myTable">
<tr id="myRow">
<th>Name</th>
<th>Date</th>
<th>Amount</th>
<tr/>
<tr>
<th>value 1</th>
<th>value 2</th>
<th>value 3</th>
</tr>
</table>
</div>
</body>