Jquery nested ul li

function buildList(data) {
    var $ul = $('<ul></ul>');
    for (const key in data) {
        var $child = $('<li></li>');
        $ul.append($child)
        if (typeof data[key] === 'object') {
            $child.text = $child.text(key);
            $child.append(buildList(data[key]));
        } else {
            $child.text = $child.text(key + ' : ' + data[key]);
        }
    }
    return $ul;
}

Source: stackoverflow.com

Jquery nested ul li

jQuery(document).ready(function($) {

$.get('url', function(data){

            var $ul = $('<ul></ul>');

            function getList(item, $list) {

                $.each(item, function (key, value) {
                    var $li = $('<li />');
                    $li.append($('<a href="#">' + key + '</a>'));

                    var $subul = $("<ul/>");

                    $.each(value, function(i) {
                        var subli = $('<li/>')
                        .text(value[i])
                        .appendTo(subli);
                    });
                    $subul.append(subli);


                    $li.append($subul)

                });
            }
            getList(data, $ul);
            $ul.appendTo("div_containing_ul");
    });});

Source: stackoverflow.com

Similar codes

12 votes312 views2 answers
Jquery-3.2.1.min.js file download
Javascript jQuery
12 votes311 views2 answers
Download jquery 3.1.1
Javascript jQuery
0 vote349 views1 answer
Extend current date with 30 days in jquery datepicker
Javascript jQuery
0 vote316 views1 answer
Jquery wrap inner text
Javascript jQuery
0 vote387 views1 answer
Jquery sum all input values
Javascript jQuery
24 votes298 views2 answers
Jquery append element to body
Javascript jQuery
36 votes295 views3 answers
Jquery add html to end of div
Javascript jQuery
14 votes322 views5 answers
/on in jquery
Javascript jQuery
0 vote339 views1 answer
Reuse jquery angular
Javascript jQuery
2 votes325 views1 answer
Jquery wait for element to exist
Javascript jQuery