遍历jQuery对象以填充多级导航

Question

我有以下用于填充导航栏的对象：

var navLinks = {
    'Products':     ['ProductCategory1', 'ProductCategory2'],
    'Collections':  ['Collection1'],
    'About':        ['AboutSection1', 'AboutSection2']
};

最高级别的nav填充如下：

$.each(navLinks, function(key, value) {
    $('#site-nav').append('<ul class="' + key + ' nav-first-level"><a href="../' + key + '">' + key + '</a><ul class="nav-second-level"></ul></ul>');
});

我希望每个键/值对中的数组通过在<ul class="nav-second-level"></ul>元素中插入标题来填充我的导航的第二级，但不确定最佳方法来处理此问题。