Insert a table row with text in cells when a button is clicked
So you want for example 6 inputs and create a table from it with the input when you click on a button.

(plain javascript):

This way it doesn't matter how many input fields you have. It will get all of them. I added some comments so you can understand what's going on.



&lt;!DOCTYPE html&gt;
&lt;html&gt;
&lt;head&gt;
&lt;style&gt;
table, td {
    border: 1px solid black;
}
&lt;/style&gt;
&lt;/head&gt;
&lt;body&gt;

&lt;p&gt;Click the button to add a new row at the first position of the table and then add cells and content.&lt;/p&gt;

&lt;table id="myTable"&gt;

&lt;/table&gt;
&lt;br&gt;

&lt;input type="text"&gt;&lt;br&gt;
&lt;input type="text"&gt;&lt;br&gt;
&lt;input type="text"&gt;&lt;br&gt;
&lt;input type="text"&gt;&lt;br&gt;
&lt;input type="text"&gt;&lt;br&gt;
&lt;input type="text"&gt;&lt;br&gt;
&lt;button onclick="Display_inputs()"&gt;Try it&lt;/button&gt;

&lt;script&gt;
function Display_inputs() {
    var table = document.getElementById("myTable");
    var row = table.insertRow(0);
    //Gets all the input fields
 var input = document.getElementsByTagName('input');
    //start from 0 till the length of input fields
  for(var i = 0, l = input.length; i &lt; l; i++){
     //creates a new cell every time it loops so in this case
        //it loops 6 times
        var cell = row.insertCell(i);
     cell.innerHTML = input[i].value;
  }
}
&lt;/script&gt;

&lt;/body&gt;
&lt;/html&gt;