无法使用Jquery动态创建Horizo​​ntal Tab

Question

我正在关注此网站，使用Jquery

动态创建水平标签

http://jqueryui.com/tabs/

我为我的代码创建了一个小提琴

http://jsfiddle.net/CMKVh/1/

请有人告诉我创建水平标签的有效方法，必须将其拆分为两行

我尝试使用以下代码

function createhorizontaltab(categories) {
    var categoryArr = JSON.parse(categories);
    var htmlbuild =$('<ul>');
    for(var i=0;i<categoryArr.categories.length;i++)
    {
        var name = categoryArr.categories[i].name;
        htmlbuild.append('<li><a href="'+name+'">name</a></li>');
    }
    var htmlbuild =$('</ul>');
    $("#tabs").append(htmlbuild);
}

Answer 1

修正：

$(document).ready(function () {
var categories= '{"categories":[{"name":"Snacks"},{"name":"One"},{"name":"Two"},{"name":"Three"},{"name":"Four"},{"name":"Five"},{"name":"Six"},{"name":"Seven"}]}'; 
createhorizontaltab(categories);
$( "#tabs" ).tabs();
});

function createhorizontaltab(categories) {
var categoryArr = JSON.parse(categories);
var htmlbuild =$('<ul>');
for(var i=0;i<categoryArr.categories.length;i++)
{
 var name = categoryArr.categories[i].name;
 htmlbuild.append('<li><a href="'+name+'">'+name+'</a></li>');
}
$("#tabs").append(htmlbuild);
}

工作小提琴：http://jsfiddle.net/robertrozas/CMKVh/2/