generate a web form that stores first name, last name, phone number, address. every row should be displayed in a data table in javascript

<form>
  <label for="firstName">First Name:</label>
  <input type="text" id="firstName" name="firstName"><br>

  <label for="lastName">Last Name:</label>
  <input type="text" id="lastName" name="lastName"><br>

  <label for="phoneNumber">Phone Number:</label>
  <input type="text" id="phoneNumber" name="phoneNumber"><br>

  <label for="address">Address:</label>
  <input type="text" id="address" name="address"><br>

  <input type="button" value="Submit" onclick="addRow()">
</form>
484 chars
16 lines

<table>
  <thead>
    <tr>
      <th>First Name</th>
      <th>Last Name</th>
      <th>Phone Number</th>
      <th>Address</th>
    </tr>
  </thead>

  <tbody id="tableBody"></tbody>
</table>
193 chars
13 lines

index.tsx
function addRow() {
  // Get the reference for the table body
  var tableBody = document.getElementById("tableBody");

  // Insert a row into the table
  var newRow = tableBody.insertRow();

  // Insert cells into the new row
  var firstNameCell = newRow.insertCell(0);
  var lastNameCell = newRow.insertCell(1);
  var phoneNumberCell = newRow.insertCell(2);
  var addressCell = newRow.insertCell(3);

  // Get the values from the form
  var firstName = document.getElementById("firstName").value;
  var lastName = document.getElementById("lastName").value;
  var phoneNumber = document.getElementById("phoneNumber").value;
  var address = document.getElementById("address").value;

  // Set the cell values
  firstNameCell.innerHTML = firstName;
  lastNameCell.innerHTML = lastName;
  phoneNumberCell.innerHTML = phoneNumber;
  addressCell.innerHTML = address;
}
864 chars
26 lines