title: How to fetch JSOn response into HTML table using pure JS?
body: <p>This is HTML markup:</p>
  
  <pre><code>&lt;table id="prodTable" class="table table-bordered" style="color:white"&gt;
    &lt;thead class="thead"&gt;
      &lt;tr class="font-weight-bold"&gt;
        &lt;th&gt;No.&lt;/th&gt;
        &lt;th&gt;Name&lt;/th&gt;
        &lt;th&gt;Category&lt;/th&gt;
        &lt;th&gt;Slug&lt;/th&gt;
        &lt;th&gt;Price&lt;/th&gt;
        &lt;th&gt;GST Price&lt;/th&gt;
        &lt;th&gt;Keywords&lt;/th&gt;
        &lt;th&gt;Specification&lt;/th&gt;
        &lt;th&gt;Description&lt;/th&gt;
        &lt;th&gt;Attributes&lt;/th&gt;
        &lt;th&gt;Available Stock&lt;/th&gt;
        &lt;th&gt;Payment Method&lt;/th&gt;
        &lt;th&gt;Approval Status&lt;/th&gt;
        &lt;th&gt;Approve&lt;/th&gt;
        &lt;th&gt;Deal of the Day&lt;/th&gt;
        &lt;th&gt;Edit &amp; Delete&lt;/th&gt;
      &lt;/tr&gt;
    &lt;/thead&gt;
    &lt;tbody class="tbody"&gt;
       &lt;tr&gt;
         &lt;td&gt;&lt;/td&gt;
         &lt;td&gt;&lt;/td&gt;
         &lt;td&gt;&lt;/td&gt;
         &lt;td&gt;&lt;/td&gt;
         &lt;td&gt;&lt;/td&gt;
         &lt;td&gt;&lt;/td&gt;
         &lt;td&gt;&lt;/td&gt;
         &lt;td&gt;&lt;/td&gt;
         &lt;td&gt;&lt;/td&gt;
         &lt;td&gt;&lt;/td&gt;
         &lt;td&gt;&lt;/td&gt;
         &lt;td&gt;&lt;/td&gt;
         &lt;td&gt;&lt;/td&gt;
         &lt;td&gt;&lt;lable&gt;&lt;input type="checkbox" id="approveProd" name="approval" value="approval"&gt;Approve&lt;/label&gt;&lt;/td&gt;
         &lt;td&gt;&lt;label&gt;&lt;input type="checkbox" id="DealoftheDay" name="dealoftheday" value="dealoftheday"&gt;Deal of the Day&lt;/label&gt;&lt;/td&gt;
         &lt;td&gt;&lt;button class="btn btn-outline-info" type="button"&gt;&lt;i class="fa fa-pencil-square"&gt;&lt;/i&gt;&lt;/button&gt; &lt;button class="btn btn-outline-danger" type="button"&gt;&lt;i class="fa fa-trash"&gt;&lt;/i&gt;&lt;/button&gt;&lt;/td&gt;
      &lt;/tr&gt;
    &lt;/tbody&gt;
  &lt;/table&gt;
  </code></pre>
  
  <p>and my js is</p>
  
  <pre><code>function getProductsData() {
      var data = "";
      var type = "application/x-www-form-urlencoded";
      var url = "get_product_data";
      var asyn = "true";
      var method = "POST";
      var respCallback = function(resp){
          var proddata = JSON.parse(resp);
          var table = document.getElementById('prodTable');
          console.log(table);
          for (var i = 0; i &lt; proddata.length; i++) {
              console.log(proddata[i]);
          };
      }
      var res=serverRequest(data,method,url,asyn,type,respCallback);
  }
  </code></pre>
  
  <p>the <code>getProductsData()</code> is a onload function written in the body and am getting the response as JSON.</p>
  
  <p>I need to know how to populate the JSON response into the table. Am new to js and i dont need jquery code. Because am learning js.</p>
  
  <p>Thanks in advance.</p>