title: Add second child jquery toggle function
body: <p>I have a table that when you click on a record opens a second level giving the user the feeling of 
  doing drill down, now it works just for one "child" or second level, but what I want know is to add a third level so when I click on any of the green options that appears on my fiddle a new level shows there.</p>
  
  <p>This is the jquery code</p>
  
  <pre><code>$('.drillDown tr td:last-child, .drillDown tr th:last-child').hide();
  $('.drillDown tr td:first-child, .drillDown tr th:first-child').click(function(){
      $('.drillDown tr td:last-child, .drillDown tr th:last-child').show();
  })
  
  $('table.drillDown').each(function() {
  
      var $table = $(this);
      $table.find('.parent').click(function() {
          console.log( "*****Click on Parent" );
          $(this).nextUntil('.parent').toggle("fast"); 
  
      });
  
      var $childRows = $table.find('tbody tr').not('.parent').hide();
      $table.find('button.hide').click(function() {
          $childRows.hide();
  
      });
  
      $table.find('button.show').click(function() {
          console.log("*****Click on Child");
          $childRows.filter('.child').show();
      });
  
      $table.find('tr.child').click(function(){
          $(this).nextUntil('.child').show()
      });
  
  });
  </code></pre>
  
  <p><a href="https://jsfiddle.net/ny6qcxtd/" rel="nofollow">https://jsfiddle.net/ny6qcxtd/</a></p>
  
  <p>Thanks for your help!</p>