title: Concatenate String in LESS in loop
body: <p>I'm working on converting <a href="http://unsemantic.com/" rel="noreferrer" title="Unsemantic">Unsemantic</a> from SASS to LESS and while I'm building the loop to create my classes:</p>
  
  <pre><code>    .populateGridClasses (@index, @interval) when (@index &gt; 0) {
      @num: @index * @interval;
      (~".eh-grid-@{num}, .eh-mobile-grid-@{num}, .eh-tablet-grid-@{num}") {
          .grid();
      }
     .populateGridClasses(@index - 1, @interval);
  }
  .populateGridClasses (0, @interval) {}
  
  // Create the grids in an inverval of 5
  .populateGridClasses(20, 5);
  </code></pre>
  
  <p>// Create the grids in thirds
     .populateGridClasses(3, 33);</p>
  
  <p>It creates the classes as so: </p>
  
  <pre><code>.eh-grid-100, .eh-mobile-grid-100, .eh-tablet-grid-100 {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    padding: 0 10px;
  }
  .eh-grid-95, .eh-mobile-grid-95, .eh-tablet-grid-95 {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    padding: 0 10px;
  }
  ...
  </code></pre>
  
  <p>Obviously, that could be condesnsed so that all 6 of those classes are defined at once. So my idea is to use the loop to create a giant string that I'll then add the <code>.grid()</code> mixin to:</p>
  
  <pre><code>@test: "";
  .populateGridClasses4 (@index, @interval) when (@index &gt; 0) {
      @num: @index * @interval;
      @ntest: ".eh-grid-@{num}, .eh-mobile-grid-@{num}, .eh-tablet-grid-@{num}";
      @test: "@{test}@{ntest}";
  .populateGridClasses4(@index - 1, @interval);
  }
  .populateGridClasses4 (0, @interval) {}
  .populateGridClasses4(20, 5);
  
  ("@{test}"){
      padding-left: 1px;
  }
  </code></pre>
  
  <p>But that gives me a LESS error <code>LESS: Out of stack space</code>. Any idea on how I can create this massive string so I can create 69 classes and only define them once? Programmatically, of course.</p>