I am using localStorage to capture form data offline so it can later be uploaded when an internet connection becomes available. Each set of data is displayed as a new row within a table. My table is wrapped in a form and the td elements have hidden input tags with values equal to their contents as below. This is created dynamically with jQuery.

```
<tr>
  <td><input type="hidden" name="FirstName" id="FirstName" value="Ollie">Ollie</td>
  <td><input type="hidden" name="Surname" id="Surname" value="Clark">Clark</td>
  ...and so on
</tr>

```

I have successfully managed to submit the form to the database with only a single row present. However, when I have multiple rows things get complicated, since all the td elements share the same ID. Is there any way I can make the form submit each row individually once the Submit button is clicked? Possibly through some kind of loop? Any answers appreciated, I have Googled this and can't seem to find anything useful. Thanks!