Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    primarykey
    data
    text
    <blockquote> <p>when the loop is run first it should already open up a div and add text to it. Next I want that if a loop has run 3 times then close the previous div and open a new div.</p> </blockquote> <p>The reason why you are doing it wrong is because <code>else { document.write("&lt;div class='span6'&gt;");}</code> will cause <code>document.write</code> even when counter is 2.</p> <p>So you should change it to <code>else if(counter == 1)</code>:</p> <pre><code>var counter = 0; for (var i = 0; i &lt; tag_array.length; i++) { //this line indicates that the counter will only be either 1,2,3 when it enters the if statement counter++; if(counter == 3){ counter = 0; document.write("&lt;/div&gt;"); }else if(counter == 1){ document.write("&lt;div class='span6'&gt;"); } document.write("&lt;div class='tag'&gt;" + toTitleCase(tag_array[i]) + "&lt;/div&gt;"); } </code></pre> <p>To make it look less confusing you can change the if statement to a switch statement, have <code>counter++;</code> in the switch statement and make the for statement into a while statement:</p> <pre><code>var counter = 0; var i = 0; var length = tag_array.length; while (i &lt;length) { switch(counter){ case 2: document.write("&lt;/div&gt;"); //when counter reaches 2, set it back to 0 and leave the switch statement; counter = 0; break; case 0: document.write("&lt;div class='span6'&gt;"); case 1: //counter++ will only be triggered when counter is 1 or 0; counter++; } document.write("&lt;div class='tag'&gt;" + toTitleCase(tag_array[i]) + "&lt;/div&gt;"); i++; } </code></pre> <p>Or if you want to be more efficient you can use the codes below. (Inspired by <a href="https://stackoverflow.com/a/19071717/2041954">frenchie's answer</a>. I corrected his answer to one that works properly.<i>If you want to upvote or accept this answer because of the codes below, please upvote or accept <a href="https://stackoverflow.com/a/19071717/2041954">his</a> instead.</i>)</p> <pre><code>var a = '&lt;div class="span6"&gt;'; var length = tag_array.length; for (var i = 0; i &lt; length; i++) { a += '&lt;div class="tag"&gt;' + toTitleCase(tag_array[i]) + '&lt;/div&gt;'; if (i % 3 == 2) { a += '&lt;/div&gt;&lt;div class="span6"&gt;'; } } a += '&lt;/div&gt;'; document.write(a); </code></pre>
    singulars
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. VO
      singulars
      1. This table or related slice is empty.
    2. VO
      singulars
      1. This table or related slice is empty.
    3. VO
      singulars
      1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload