title: Multi Nested Expand and collapse
body: <p>I am trying to create a nested expandable and collapse tab.
  I am able to implement the first level. i.e. If I click on key1, it will expand the list.</p>
  
  <p>However, for key 5, when I click on it, both the second level and third level expand. Is there a way that when I click on key 5, only the second level will expand.</p>
  
  <p>Is there any better way to create a nested expand and collapsable data? </p>
  
  <p><a href="https://jsfiddle.net/charles30hk/8ykLdnox/" rel="nofollow">https://jsfiddle.net/charles30hk/8ykLdnox/</a></p>
  
  <p>HTML Code: </p>
  
  <pre><code>&lt;ul class="archive_0"&gt;
    &lt;li class="level_0"&gt;key1
      &lt;ul class="archive_1"&gt;
        &lt;li class="level_1"&gt;key11     value11&lt;/li&gt;
        &lt;li class="level_1"&gt;key12     value12&lt;/li&gt;
      &lt;/ul&gt;&lt;/li&gt;&lt;li class="level_0"&gt;key2     value2&lt;/li&gt;
      &lt;li class="level_0"&gt;key3     value3&lt;/li&gt;
      &lt;li class="level_0"&gt;key4     value3&lt;/li&gt;
      &lt;li class="level_0"&gt;key5
        &lt;ul class="archive_1"&gt;
          &lt;li class="level_1"&gt;key51     value11&lt;/li&gt;
          &lt;li class="level_1"&gt;key52     value12&lt;/li&gt;
          &lt;li class="level_1"&gt;key53&lt;ul class="archive_2"&gt;
            &lt;li class="level_2"&gt;key531     value&lt;/li&gt;
            &lt;li class="level_2"&gt;key52     value12&lt;/li&gt;
          &lt;/ul&gt;
        &lt;/li&gt;
      &lt;/ul&gt;
    &lt;/li&gt;
   &lt;/ul&gt;
  </code></pre>
  
  <p>JS: </p>
  
  <pre><code>$('.archive_0 ul').hide();
  
  $('.level_0').click(function() {
      //$(this).parent().find('ul').slideToggle();
      $(this).find('ul').slideToggle();
  });
  
  
  $('.archive_1 ul').hide();
  
  $('.level_1').click(function() {
      $(this).find('ul').slideToggle();
  });
  
  $('.archive_2 ul').hide();
  
  $('.level_2').click(function() {
      $(this).find('ul').slideToggle();
  });
  
  $('.archive_3 ul').hide();
  
  $('.level_3').click(function() {
      $(this).find('ul').slideToggle();
  });
  </code></pre>