js实现递归调用菜单

效果如图：

js

var data = [
        {
            name: 'AAA',
            child: [
                {
                    name: 'a1',
                    child: [
                        {
                            name: 'a1-1'
                        },
                        {
                            name: 'a1-2'
                        }
                    ]
                },
                { name: 'a2' }
            ]
        },
        {
            name: 'BBB',
            child: [
                {
                    name: 'b1'
                },
                {
                    name: 'b2'
                }
            ]
        },
        {
            name: 'CCC',
            child: [
                {
                    name: 'c1'
                },
                {
                    name: 'c2'
                }
            ]
        }
    ];
    var lists = $(".lists");
    function build(ele, arr) {
        var strUl = $('<ul></ul>');
        for (var i = 0; i < arr.length; i++) {
            var strLi = $("<li>" + arr[i].name + "</li>");
            strLi.appendTo(strUl);
            if (arr[i].child) {
                build(strLi, arr[i].child);
            }
        }
        strUl.appendTo(ele);
    }
    build(lists, data);