title: How can I setup Javascript dynamically to expand divs when clicking another div?
body: <p>I am creating a main menu in asp.net using dynamically created divs.</p>
  
  <p>The divs are associated with 3 different levels.</p>
  
  <p>I have done everything I need but am struggling with expanding and collapsing the menus.</p>
  
  <p>I need to show only level 1 items when the page is loaded (probably easier using CSS?)</p>
  
  <p>Then I need to be able to expand level2 items for a particular level1 item when that item is clicked.</p>
  
  <p>I will then need to collapse them after a certain time period.</p>
  
  <p>The code below shows how the divs are created and statements for specific levels:</p>
  
  <pre><code>  private void CreateDiv(string divId, string URL, int level)
      {
          //Attributes for all items
          HtmlGenericControl div = new HtmlGenericControl("div");
          div.Attributes.Add("id", divId);
  
          div.Controls.Add(
              new Label()
              {
                  ID = "lbl" + divId,
                  Text = divId
              });
  
  
          if (level == 1)
          {
  
              div.Attributes.Add("class", "level1");
              //Code to expand level 2 items
  
          }
  
          if (level == 2)
          {
              div.Attributes.Add("class", "level2");
              //Code to expand level 3 items
          }
          if (level == 3) //Specific attributes for level 3 items
          {
              div.Attributes.Add("class", "level3");
              div.Attributes.Add("onclick", "window.open('" + URL + "', 'mywindow');");
          }
          divMenuleft.Controls.Add(div);
  
      }
  </code></pre>