Insert a table row with text in cells when a button is clicked I made a function to dynamically create this table and a button with a function to display texts inside the table shown as a message.

&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;button onclick="myFunction()"&gt;Try it&lt;/button&gt;

&lt;script&gt;
function myFunction() {
    var table = document.getElementById("myTable");
    var row = table.insertRow(0);
    var cell1 = row.insertCell(0);
    var cell2 = row.insertCell(1);
    var cell3 = row.insertCell(2);
    var cell4 = row.insertCell(3);
    var cell5 = row.insertCell(4);
    var cell6 = row.insertCell(5);
    cell1.innerHTML = "please";
    cell2.innerHTML = "put";
    cell3.innerHTML = "information";
    cell4.innerHTML = "here";
    cell5.innerHTML = "fill";
    cell6.innerHTML = "up";
}
&lt;/script&gt;

&lt;/body&gt;
&lt;/html&gt;
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;