title: Using :nth-child to loop through children LI elements
body: <p>Ok, I have a situation where I have a set list of colors, let's say <code>10</code>.</p>
  
  <p>Now I want to run through this list of colors for child elements and give them the color from 1- 10; however I don't know how many children I am going to have beforehand so I'm not sure how to handle that.</p>
  
  <p>Like, child 1 should have color 1, but child 11 should also have color 1 (as the color list has started over again) and obviously child 2 would get color 2 and child 12 would get color 2 and so on and so on...</p>
  
  <p><strong>Example HTML:</strong></p>
  
  <pre class="lang-html prettyprint-override"><code>&lt;ul&gt;
      &lt;li&gt;Some Text&lt;/li&gt; &lt;!-- Color #1 --&gt;
      &lt;li&gt;Some Text&lt;/li&gt; 
      &lt;li&gt;Some Text&lt;/li&gt;
      &lt;li&gt;Some Text&lt;/li&gt;
      &lt;li&gt;Some Text&lt;/li&gt;
      &lt;li&gt;Some Text&lt;/li&gt;
      &lt;li&gt;Some Text&lt;/li&gt;
      &lt;li&gt;Some Text&lt;/li&gt;
      &lt;li&gt;Some Text&lt;/li&gt;
      &lt;li&gt;Some Text&lt;/li&gt; &lt;!-- Color #10 --&gt;
  
      &lt;li&gt;Some Text&lt;/li&gt; &lt;!-- Color #1 --&gt;
      &lt;li&gt;Some Text&lt;/li&gt;        
      &lt;li&gt;Some Text&lt;/li&gt;
      &lt;li&gt;Some Text&lt;/li&gt;
      &lt;li&gt;Some Text&lt;/li&gt;
      &lt;li&gt;Some Text&lt;/li&gt;
      &lt;li&gt;Some Text&lt;/li&gt; &lt;!-- Color #7 --&gt;
  &lt;/ul&gt;
  </code></pre>
  
  <p>Is there anyway to do this with <code>:nth-child</code> or something else such as a Sass function?</p>