Create the menu and sub menu using jquery
<p>What I want is to loop the data from database and create the menu, if each content of the menu
have the sub menu, then it will show the sub menu as :</p>

<pre><code>&lt;ul&gt;
&lt;li&gt;test1&lt;/li&gt;
&lt;li&gt;test2&lt;/li&gt;
&lt;li&gt;test3
    &lt;ul&gt;
       &lt;li&gt;sub menu1&lt;/li&gt;
       &lt;li&gt;sub menu2&lt;/li&gt;
    &lt;/ul&gt;
&lt;/li&gt;
&lt;/ul&gt;
</code></pre>

<p>I create the menu with the Jquery as below :</p>

<pre><code>$(document).ready(function () {
 $.getJSON(url, function (data) {
    $.each(data, function (index, dataOption) {
        $("#navmenu-v").append("&lt;li id='testList'&gt;
            &lt;a href='javascript:void(0);' id='" + dataOption.ID + "'&gt;" +
                    dataOption.Name + "&lt;/a&gt;");
            if (dataOption.NumCat &gt; 0) { //NumCat is the amount of sub menu
              $("#testList").append("&lt;ul&gt;&lt;li&gt;&lt;a&gt;Testing cate&lt;/a&gt;&lt;/li&gt;&lt;/ul&gt;");
            }
        $("#navmenu-v").append("&lt;/li&gt;");
    });
  });
  });

  &lt;div id="content"&gt;
     &lt;ul id='navmenu-v'&gt;

     &lt;/ul&gt;
   &lt;/div&gt;
</code></pre>

<p>But the "Testing cate" shows only in the first list of the menu. </p>

<p>Could anyone tell me how to do that please. Thanks so much.</p>
