title: How to put first row in tsv to row thead <th> in table and the rest go to tbody <td> with d3
body: <p>I'm trying to learn D3 by creating a table. The code below is what I have so far. </p>
  
  <p>Say my TSV data has 3 columns, I only want the first row ( 3 object from data ) => to be in my thead section 
  and the rest ( 4th object of my data )  go into tbody section </p>
  
  <pre><code>d3.text("test.tsv",  function(text) {
      var data = d3.tsv.parseRows(text);
  
  var table = d3.select("body").append("table"), 
        thead = table.append("thead"),
        tbody = table.append("tbody");
  
   var hrows = thead.selectAll("tr")
        .data(data)
        .enter()
        .append("tr");
  
  
  
        var hcells = hrows.selectAll("th")
        .data(function(row) {
          return d3.range(Object.keys(row).length).map(function(column, i) {
            return row[Object.keys(row)[i]];
            });
          })
        .enter()
        .append("th")
        .text(function(d) { return d; });
  
  // ============
        var rows = tbody.selectAll("tr")
        .data(data)
        .enter()
        .append("tr");
  
  
        var cells = rows.selectAll("td")
        .data(function(row) {
          return d3.range(Object.keys(row).length).map(function(column, i) {
            return row[Object.keys(row)[i]];
            });
          })
        .enter()
        .append("td")
        .text(function(d) { return d; });
   });
  </code></pre>