JQuery是一個輕量級的JavaScript庫，因為它提供了開發人員可以輕松使用的便捷功能，可以對HTML文檔進行簡化和處理。在這篇文章中，我們將介紹如何使用JQuery遞歸遍歷生成ul的方法。

function createList(data, $parent) {
var $ul = $("<ul>");
$parent.append($ul);
$.each(data, function(index, value) {
var $li = $("<li>");
$ul.append($li);
$li.text(value.text);
if (value.children && value.children.length) {
createList(value.children, $li);
}
});
}
var data = [
{
text: "Level 1",
children: [
{
text: "Level 2",
children: [
{
text: "Level 3",
children: [
{
text: "Level 4"
}
]
}
]
}
]
}
];
createList(data, $("#list-container"));

該函數的作用是生成一個嵌套的無序列表。將數據對象和父級$ ul的JQuery元素作為參數傳遞給它。它通過使用each（）方法循環遍歷數據對象。每個值都用li元素封裝。如果值具有子級，則該函數遞歸調用自身并將子值和li作為$ parent傳遞。

此時，我們已經生成了一個嵌套的無序列表，但還需要一些CSS樣式以美化列表。

ul {
list-style: none;
padding-left: 20px;
}
li {
margin-left: -15px;
}
li:before {
content: "";
display: inline-block;
width: 10px;
height: 10px;
border-radius: 50%;
margin-right: 10px;
background-color: #444;
}
li:last-child:before {
display: none;
}

最后，我們將CSS樣式應用于父級元素，并將其附加到HTML中的容器中。

<div id="list-container"></div>

我們已經成功地使用JQuery遞歸遍歷生成嵌套的無序列表，并使用CSS樣式進行美化。這個方法可以被使用在很多場合，例如菜單、網站導航、文件夾等等。