title: How to append a row to html table using DOM?
body: <p>I'm trying to add a row to a HTML table in pure JS as follows,</p>
  
  <pre><code>    var tbody = document.getElementsByClassName('table1_out').getElementsByTagName("TBODY");
      var row = document.createElement("TR");
  
      var td1 = document.createElement("TD")
      var strHtml1 = "&lt;?php echo $addNewCurrencyPOST["id"] ?&gt;";
      td1.innerHTML = strHtml1;
  
      var td2 = document.createElement("TD")
      var strHtml2 = "&lt;div class='led on'&gt;&lt;/div&gt;";
      td2.innerHTML = strHtml2;
  
      var td3 = document.createElement("TD")
      var strHtml3 = "&lt;?php echo $addNewCurrencyPOST["symbol"] ?&gt;";
      td3.innerHTML = strHtml3;
  
      var td4 = document.createElement("TD")
      var strHtml4 = "&lt;?php echo $addNewCurrencyPOST["symbolhtml"] ?&gt;";
      td4.innerHTML = strHtml4;
  
      var td5 = document.createElement("TD")
      var strHtml5 = "&lt;?php echo $addNewCurrencyPOST["usdrate"] ?&gt;";
      td5.innerHTML = strHtml5;
  
      var td6 = document.createElement("TD")
      var strHtml6 = "&lt;?php echo $addNewCurrencyPOST["eurrate"] ?&gt;";
      td6.innerHTML = strHtml6;
  
      var td7 = document.createElement("TD")
      var strHtml7 = '';
      td7.innerHTML = strHtml7;
  
      // append data to row
      row.appendChild(td1);
      row.appendChild(td2);
      row.appendChild(td3);
      row.appendChild(td4);
      row.appendChild(td5);
      row.appendChild(td6);
      row.appendChild(td7);
  
      // append row to table
      tbody.appendChild(row);
  </code></pre>
  
  <p>And this is the structure of the table,</p>
  
  <pre><code>&lt;div class="table1_out"&gt;
          &lt;table&gt;
              &lt;thead&gt;
                  &lt;tr&gt;
                      &lt;th&gt;Id&lt;/th&gt;
                      &lt;th&gt;Status&lt;/th&gt;
                      &lt;th&gt;Symbol&lt;/th&gt;
                      &lt;th&gt;Symbol html&lt;/th&gt;
                      &lt;th&gt;Exchange rate EUR&lt;/th&gt;
                      &lt;th&gt;Exchange rate USD&lt;/th&gt;
                      &lt;th&gt;Actions&lt;/th&gt;
                  &lt;/tr&gt;
              &lt;/thead&gt;
              &lt;tbody&gt;
      &lt;tr&gt;
      &lt;td&gt;EUR&lt;/td&gt;
      &lt;td&gt;&lt;div class="led on"&gt;&lt;/div&gt;&lt;/td&gt;
      &lt;td&gt;€&lt;/td&gt;
      &lt;td&gt;&amp;amp;euro;&lt;/td&gt;
      &lt;td&gt;1&lt;/td&gt;
      &lt;td&gt;1.319810&lt;/td&gt;
      &lt;td&gt;&lt;input type="button" value="Edit" onclick="document.location.href='/backoffice_dev.php/currency/edit/EUR';"&gt;&lt;/td&gt;
  &lt;/tr&gt;                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                           &lt;/tbody&gt;
          &lt;/table&gt;
      &lt;/div&gt;
  </code></pre>
  
  <p>But it is throwing the error:</p>
  
  <blockquote>
    <p>TypeError: tbody.appendChild is not a function</p>
  </blockquote>