Knockout - Menu (ul and li)

Applying knockoutjs to form ul li list.

by bhatnagar018

HTML

<ul data-bind="foreach: menu" id="parent">
    <li> <b data-bind="text: parent"> </b>

        <ul data-bind="foreach: submenu" id="submenu">
            <li>
                <label data-bind="text: name"></label>
            </li>
        </ul>
    </li>
</ul>

CSS

#parent {
    display:inline;
}
#submenu {
    display:inline;
}

JavaScript

ko.applyBindings({
    menu: [{
        parent: 'Rates',
        submenu: [{
            name: 'Rate 1'
        }, {
            name: 'Rate 2'
        }, {
            name: 'Rate 3'
        }]
    }, {
        parent: 'Shipments',
        submenu: [{
            name: 'Barnsley'
        }, {
            name: 'Ankur'
        }]
    }]
});