title: Bind jSon Data in HTML Table
body: <p>I am trying to import excel data and finally bind it to <code>HTML</code> table. For now, it works but I made a slight change on the data bind and unfortunately unable to bind data as expected. Here's the code snippet with sample <code>jSon</code> data that I tried so far:</p>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>var data = [{
      ID: "1002",
      EMAIL: "hello@sample.com"
    },
    {
      ID: "1004",
      EMAIL: "hello2@sample.com"
    },
    {
      ID: "1006",
      EMAIL: "hello3@sample.com"
    },
    {
      ID: "1008",
      EMAIL: "hello4@sample.com"
    }
  ];
  
  var table = document.createElement("table");
  table.border = "1";
  
  var cell = "";
  var row = table.insertRow(-1);
  
  //Add the header cells
  var headerCell = document.createElement("TH");
  headerCell.innerHTML = ("ID");
  row.appendChild(headerCell);
  
  headerCell = document.createElement("TH");
  headerCell.innerHTML = ("EMAIL");
  row.appendChild(headerCell);
  
  data.forEach(function(obj) {
    //Get an array of all available keys in current element
    var keys = Object.keys(obj);
  
    //Loop through all obtained keys
    keys.forEach(function(key) {
  
      //The following line will match ID/IDS/id/ids
      if (key.toUpperCase().indexOf("ID") &gt; -1) {
        //Add the data cells
        cell = table.insertRow(-1).insertCell(-1);
  
        cell.innerHTML = obj[key];
        //console.log("found ids: ", obj[key]);
      }
  
      //The following line will match AMOUNT/AMOUNTS/amount/amounts
      if (key.toUpperCase().indexOf("EMAIL") &gt; -1) {
        //Add the data cells
        cell = table.insertRow(-1).insertCell(-1);
        cell.innerHTML = obj[key];
        //console.log("found emails: ", obj[key]);
      }
    });
  });
  
  var dvExcel = document.getElementById("excelTable");
  dvExcel.innerHTML = "";
  dvExcel.appendChild(table);</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;div id="excelTable"&gt;&lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>
  <p>The issue is, the data I am having is in the below format:</p>
  <pre><code>ID       EMAIL
  1002
  hello@abc.com
  1004
  hello2@abc.com
  </code></pre>
  <p><strong>Expected Output</strong>:</p>
  <pre><code>ID     EMAIL
  1002   hello@abc.com
  1004   hello2@abc.com
  </code></pre>