Create nested UL lists from data object

Question

I\'m trying to create a nested UL from JSON. I am able to loop through and grab the data from the object, but I am having trouble building the nested UL. I figure the \'.app

Answer 1

Here is a solution:

var mainMenu = $("#test ul.mainMenu");
var i, j, k, navItem, navItemLevel1, navItemLevel2;

for(var i = 0; i < menu.length; i++){
    var navItem = menu[i];
    var new_li = $('
' + navItem.title +' 
');
    mainMenu.append(new_li);

        for(var j = 0; j < menu[i].menu.length; j++){
            var new_li_ul = $('ul.submenuLevel1', new_li);
            if(new_li_ul.length <= 0){
                new_li_ul  = $('
');
                new_li.append(new_li_ul);
            } 
            var navItemLevel1 = navItem.menu[j];
            var new_li_li = $('
' + navItemLevel1.title +' 
');
            new_li_ul.append(new_li_li);

                for(var k = 0; k < menu[i].menu[j].menu.length; k++){
                    var new_li_ul_ul = $('ul.submenuLevel2', new_li_li);
                    if(new_li_ul_ul.length <= 0){
                        new_li_ul_ul = $('
');
                        new_li_li.append(new_li_ul_ul);
                    } 
                    var navItemLevel2 = navItemLevel1.menu[k];
                    new_li_ul_ul.append('
' + navItemLevel2.title +' 
');
                }
        }
};

Here is a fiddle: http://jsfiddle.net/maniator/6JnuG/3/