Render 3 column table using an array

[shebinleo]

I am having trouble in rendering a 3 column table using an array

var list = [1, 2, 3, 4, 5,  6]

code I am currently using is

table
   - each value, index in list
     - if (index%3==0) {
       tr
     - }
       td=value

what I am getting using code above is

<table>
  <tbody>
    <tr></tr>
    <tr>
       <td>1</td>
       <td>2</td>
       <td>3</td>
    </tr>
    <tr></tr>
    <tr>
      <td>4</td>
      <td>5</td>
      <td>6</td>
    </tr>
  </tbody>
</table>

what I want is the table below without the extra tr

<table>
  <tbody>
    <tr>
       <td>1</td>
       <td>2</td>
       <td>3</td>
    </tr>
    <tr>
      <td>4</td>
      <td>5</td>
      <td>6</td>
    </tr>
  </tbody>
</table>

[mjadobson]

It's hard to tell from the code you've given here, but I think it may be more appropriate to present your array as floated list items, rather than a table.

Regardless, this is how I would tackle this with tables:

var list = [1,2,3,4,5,6,7];
var listChunks = [];

for (var i = 0; i < Math.ceil(list.length / 3); i++) {
  listChunks.push(list.slice(3 * i, 3 * (i + 1)));
}

table
  tbody
    each chunk in listChunks
      tr
        each val in chunk
          td= val

[shebinleo]

Thank you, floated list items is the right solution for my problem.

Thank you for the table code too.