title: ASP.NET Repeater, need new row after every 5 items
body: <p>So I have a repeater as follows :</p>
  
  <pre><code>                &lt;asp:Repeater ID="footerMenuRepeater" runat="server" onitemdatabound="FooterMenuRepeaterItemDataBound"&gt;
                  &lt;HeaderTemplate&gt;
                      &lt;ul id="mainMenuList"&gt;
                  &lt;/HeaderTemplate&gt;
                  &lt;ItemTemplate&gt;
                      &lt;li class="footerParentSubLists &lt;%# ((FooterMenuItem)Container.DataItem).MenuTitleBoldClass %&gt; &lt;%# Container.ItemIndex == 5 ? "liClearLeft" : string.Empty %&gt;"&gt;
                          &lt;div id="footerMenuDiv"&gt;
                             &lt;a class="footerMenuHeader" href='&lt;%# ((FooterMenuItem)Container.DataItem).CallToActionLink %&gt;'&gt;&lt;%# ((FooterMenuItem)Container.DataItem).Title %&gt;&lt;/a&gt;
                          &lt;/div&gt;
                          &lt;asp:Repeater ID="subItemRepeater" runat="server"&gt;
                              &lt;HeaderTemplate&gt;
                                  &lt;ul class="footerChildSubList"&gt;
                              &lt;/HeaderTemplate&gt;
                              &lt;ItemTemplate&gt;
                                  &lt;li&gt;&lt;a class="footerMenuItems &lt;%# ((FooterMenuItem)Container.DataItem).ArrowClass %&gt;" href="&lt;%# ((FooterMenuItem)Container.DataItem).CallToActionLink %&gt;"&gt;&lt;%# ((FooterMenuItem)Container.DataItem).Title %&gt;&lt;/a&gt;
                                  &lt;/li&gt;
                              &lt;/ItemTemplate&gt;
                              &lt;FooterTemplate&gt;
                                  &lt;/ul&gt;
                              &lt;/FooterTemplate&gt;
                          &lt;/asp:Repeater&gt;                
                      &lt;/li&gt;
                  &lt;/ItemTemplate&gt;
                  &lt;FooterTemplate&gt;
                      &lt;/ul&gt;
                  &lt;/FooterTemplate&gt;
            &lt;/asp:Repeater&gt; 
  </code></pre>
  
  <p>What I am looking to do is for each 5 items in this repeater is to create a new row, so my mark up would be as follows</p>
  
  <p><strong>HTML</strong></p>
  
  <pre><code>&lt;ul id="mainMenuList"&gt;
      &lt;li&gt; &lt;!-- row 1  --&gt;
          &lt;ul&gt;
              &lt;li class="footerParentSubLists"&gt;
                  &lt;div&gt;
                     &lt;a class="footerMenuHeader"&gt;Header 1&lt;/a&gt;
                  &lt;/div&gt;
                  &lt;ul class="footerChildSubList"&gt;
                     &lt;li&gt;
                         &lt;a&gt;Sub 1.1&lt;/a&gt;
                     &lt;/li&gt;
                     &lt;li&gt;
                         &lt;a&gt;Sub 1.2&lt;/a&gt;
                     &lt;/li&gt;
                     &lt;li&gt;
                         &lt;a&gt;Sub 1.3&lt;/a&gt;
                     &lt;/li&gt;
                   &lt;/ul&gt;
              &lt;/li&gt;
              &lt;li class="footerParentSubLists"&gt;
                  &lt;div&gt;
                     &lt;a class="footerMenuHeader"&gt;Header 2&lt;/a&gt;
                  &lt;/div&gt;
                  &lt;ul class="footerChildSubList"&gt;
                     &lt;li&gt;
                         &lt;a&gt;Sub 2.1&lt;/a&gt;
                     &lt;/li&gt;
                     &lt;li&gt;
                         &lt;a&gt;Sub 2.2&lt;/a&gt;
                     &lt;/li&gt;
                   &lt;/ul&gt;
              &lt;/li&gt;
              &lt;li class="footerParentSubLists"&gt;
                  &lt;div&gt;
                     &lt;a class="footerMenuHeader"&gt;Header 3&lt;/a&gt;
                  &lt;/div&gt;
              &lt;/li&gt;
              &lt;li class="footerParentSubLists"&gt;
                  &lt;div&gt;
                     &lt;a class="footerMenuHeader"&gt;Header 4&lt;/a&gt;
                  &lt;/div&gt;
              &lt;/li&gt;
              &lt;li class="footerParentSubLists"&gt;
                  &lt;div&gt;
                     &lt;a class="footerMenuHeader"&gt;Header 5&lt;/a&gt;
                  &lt;/div&gt;
                  &lt;ul class="footerChildSubList"&gt;
                     &lt;li&gt;
                         &lt;a&gt;Sub 5.1&lt;/a&gt;
                     &lt;/li&gt;
                     &lt;li&gt;
                         &lt;a&gt;Sub 5.2&lt;/a&gt;
                     &lt;/li&gt;
                   &lt;/ul&gt;
              &lt;/li&gt;            
          &lt;/ul&gt;    
      &lt;/li&gt;
      &lt;li&gt; &lt;!-- row 2  --&gt;
          &lt;ul&gt;
              &lt;li class="footerParentSubLists"&gt;
                  &lt;div&gt;
                     &lt;a class="footerMenuHeader"&gt;Header 6&lt;/a&gt;
                  &lt;/div&gt;
                  &lt;ul class="footerChildSubList"&gt;
                     &lt;li&gt;
                         &lt;a&gt;Sub 6.1&lt;/a&gt;
                     &lt;/li&gt;
                     &lt;li&gt;
                         &lt;a&gt;Sub 6.2&lt;/a&gt;
                     &lt;/li&gt;
                     &lt;li&gt;
                         &lt;a&gt;Sub 6.3&lt;/a&gt;
                     &lt;/li&gt;
                   &lt;/ul&gt;
              &lt;/li&gt;
              &lt;li class="footerParentSubLists"&gt;
                  &lt;div&gt;
                     &lt;a class="footerMenuHeader"&gt;Header 7&lt;/a&gt;
                  &lt;/div&gt;
                  &lt;ul class="footerChildSubList"&gt;
                     &lt;li&gt;
                         &lt;a&gt;Sub 7.1&lt;/a&gt;
                     &lt;/li&gt;
                     &lt;li&gt;
                         &lt;a&gt;Sub 7.2&lt;/a&gt;
                     &lt;/li&gt;
                     &lt;li&gt;
                         &lt;a&gt;Sub 7.3&lt;/a&gt;
                     &lt;/li&gt;
                   &lt;/ul&gt;
              &lt;/li&gt;
          &lt;/ul&gt;
      &lt;/li&gt;
  &lt;/ul&gt;
  </code></pre>
  
  <p>Just wondering how I can add this logic to the repeater</p>