title: Add <ul> <li> list in aspx from code-behind
body: <p>I am trying to make nested <code>ul</code> &amp; <code>li</code> tags in code behind. 
  For that i wrote priliminary code in my <code>.aspx</code> page</p>
  
  <pre><code>&lt;ul class="dropdown" runat="server" id="tabs"&gt; &lt;/ul&gt;
  </code></pre>
  
  <p>My C# Code </p>
  
  <pre><code>DatTable dtOutput = Generix.getData("Get Some Data");
  
  foreach (DataRow drOutput in dtOutput.Rows)
  {
      HtmlGenericControl li = new HtmlGenericControl("li");                    
      tabs.Controls.Add(li);
      HtmlGenericControl anchor = new HtmlGenericControl("a");
      anchor.Attributes.Add("href", "#");
      anchor.InnerText = Convert.ToString(drOutput["ModuleGroup"]);
      li.Controls.Add(anchor);
      HtmlGenericControl ul = new HtmlGenericControl("ul");
  
      DatTable dtOutputList = Generix.getData("Get another set of Data");
  
      foreach (DataRow drOutputList in dtOutputList.Rows)
      {                        
          HtmlGenericControl ili = new HtmlGenericControl("li");
          ul.Controls.Add(ili);
          HtmlGenericControl ianchor = new HtmlGenericControl("a");
          foreach (DataColumn dcOutputList in dtOutputList.Columns)
          {
              ianchor.Attributes.Add("href", Convert.ToString(drOutputList["ModuleFileName"]));
          }
          ianchor.InnerText = Convert.ToString(drOutputList["ModuleName"]);
          ili.Controls.Add(ianchor);                        
      }
      //tabs.Controls.Add(li);
  }
  </code></pre>
  
  <p>When i run my project and do inspect element on my menu i see something like</p>
  
  <pre><code>&lt;ul id="ctl00_tabs" class="dropdown"&gt;
      &lt;li class=""&gt;
          &lt;a href="#"&gt;Master&lt;/a&gt;
      &lt;/li&gt;
      &lt;li class=""&gt;
          &lt;a href="#"&gt;Cards Management&lt;/a&gt;
      &lt;/li&gt;
      &lt;li class=""&gt;
          &lt;a href="#"&gt;Authorization&lt;/a&gt;
      &lt;/li&gt;
      &lt;li class=""&gt;
          &lt;a href="#"&gt;Loyalty&lt;/a&gt;
      &lt;/li&gt;
      &lt;li class=""&gt;
          &lt;a href="#"&gt;Reports&lt;/a&gt;
      &lt;/li&gt;
  &lt;/ul&gt;
  </code></pre>
  
  <p><strong>No Nested <code>ul</code> tags are created inside <code>li</code> ?? Why ??</strong></p>
  
  <p>For example :-</p>
  
  <pre><code>&lt;ul id="ctl00_tabs" class="dropdown"&gt;
      &lt;li class=""&gt;
          &lt;a href="#"&gt;Master&lt;/a&gt;
          &lt;ul&gt;
              &lt;li&gt;&lt;a href="Some.aspx"&gt;&lt;span&gt;Some Name&lt;/span&gt;&lt;/a&gt;&lt;/li&gt;
              &lt;li&gt;&lt;a href="Some1.aspx"&gt;&lt;span&gt;Some Name 1&lt;/span&gt;&lt;/a&gt;&lt;/li&gt;
          &lt;/ul&gt;
      &lt;/li&gt;
  &lt;/ul&gt;
  </code></pre>