如何访问动态菜单（JQuery）的第二级？

我有一个菜单，只适用于1级和2级，但我需要更深入并显示所有子级别。
加载时菜单是这样的：

  
<a id="" class="list-group-item active">
   

我希望有这样的子级别，或者你可能以某种方式提供。

 
 
Home 
 
About us
 
About us
 
About us
 
 About us 
 
Sub Item 1
 
 Sub Item 2 
 
Sub item 3
 
Sub item 4
 
 
 
 
 
 
 
about 
 
Home
 
Home
 
Home
 
Home
 
 
  

为实现这一目标，我正在使用这样一个脚本：

  $(document).ready(function(){ $('ul#mnav > li > a').on('click', function(e) { console.log("Level 1"); e.preventDefault(); var cat = $(this).attr('id'); var url = 'index.php?route=test/categoryx/child&category_id=' + cat; $('#mnav #sub1').remove(); $( $("
").load(url + "#myContainer") ).insertAfter( '#mnav #' + cat ); }); $('ul#sub1 a').on('click', function(e) { console.log("Level 2"); e.preventDefault(); var cat = $(this).attr('id'); var url = 'index.php?route=test/categoryx/child&category_id=' + cat; $('#sub2').remove(); $( $("
").load(url + "#myContainer") ).insertAfter( 'ul#sub1 #' + cat ); });  

我尝试了不同的方式来访问第二级，但它没有成功，我尝试了很多不同的东西。