title: Dynamically create rows with for loop in Bootstrap / HTML
body: <p>I have an apps script that dynamically creates content from a Google Sheet, loading content into Bootstrap grid components.</p>
  
  <p>While the code does work correctly, I need to cater for multiple rows, explained below.</p>
  
  <p>A simplified version of the code is:</p>
  
  <pre><code>&lt;? for (var i=0 ; i &lt;lastRow; ++i) { ?&gt;
  &lt;?if(getNSW[i] != "" &amp;&amp; getNSW[i] != "TOTAL") {?&gt;
          &lt;div class="col-md-4"&gt;
                  &lt;!-- output --&gt;
              &lt;/div&gt;
          &lt;/div&gt;&lt;? }} ?&gt;
  </code></pre>
  
  <p>What I am aiming to do is for every 3rd col div created, to put them in a new "row" div.</p>
  
  <p>Output would be something like:</p>
  
  <pre><code>&lt;div class="row"&gt;
    &lt;div class="col-md-4"&gt;&lt;!-- content --&gt;&lt;/div&gt;
    &lt;div class="col-md-4"&gt;&lt;!-- content --&gt;&lt;/div&gt;
    &lt;div class="col-md-4"&gt;&lt;!-- content --&gt;&lt;/div&gt;
  &lt;/div&gt;
  &lt;div class="row"&gt;
    &lt;div class="col-md-4"&gt;&lt;!-- content --&gt;&lt;/div&gt;
    &lt;div class="col-md-4"&gt;&lt;!-- content --&gt;&lt;/div&gt;
    &lt;div class="col-md-4"&gt;&lt;!-- content --&gt;&lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>Obviously I need some sort of for loop to count the cols etc... I am just drawing a blank for the correct syntax.</p>