I've two JavaScript arrays that I wish to populate HTML tables with but I can't seem to get the order of HTML tags correct to layout the table how I'm looking.

HTML:

```
<div id="dateRangeTable"></div>

```

JavaScript:

```
var days = ["Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday", "Sunday"];
var sensorEventCount = [41,47,36,0,0,0,0];

function popTable(array, arrayTwo) {
    var list = document.createElement('table');
    var item;
    item = document.createElement('tr');
    for (var i = 0; i < array.length; i++) {
        item = document.createElement('td');
        item.appendChild(document.createTextNode(array[i]));
        list.appendChild(item);
    }
    item.appendChild(document.createElement('tr'));
    for (var i = 0; i < array.length; i++) {    
        item.appendChild(document.createElement('td'));
        item.appendChild(document.createTextNode(arrayTwo[i]));
        list.appendChild(item);
    }
    return list;
}

```

I'm looking it displayed with each array in line above and below each other, i.e.

```
Monday   Tuesday   Wednesday   Thursday etc.
  41       47         36           0

```

At the moment is printing like:

```
Monday Tuesday Wednesday Thursday Friday Saturday Sunday
                                                  41
                                                  47
                                                  36
                                                  0
                                                  etc.

```