Jquery 项目上的ajax动态列表单击“创建新子列表”

我正在尝试使用jQuery mobile在动态列表中创建动态列表 我尝试使用

item.On（“单击”，callGroups）但我无法将参数传递给函数。
我正在使用jQueryMobile 1.3和jQuery1.8

这是我的ajax代码

<script type="text/javascript" type="text/javascript">


        $(document).ready(function () {

            Greating();
        });

        //  $(document).on('pageinit', function () {
       function callGroups(ID)
       {
       $("#"+ID).append("<ul><li> first</li><li>second item</li> </a></li> ");


       }

        function Greating() {

            $.ajax({

                type: "POST",
                url: "CarService.asmx/GetAllsections",
                data: "{}",
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                success: function (response) {

                    var sections = response.d;
                    $('#page_body').append("<div data-role='page' id= 'ssaadd'><div>");
                    $.mobile.initializePage();

                    $.each(sections, function (index, section) {

                        //  asd = "listsec" + section.secId;
                        $("#theList").append("<li> <a id = '"+section.secId+"' ><img src='pic/" + section.SecImg + "'> <br /> " + section.SecName + '   ' + section.SecArbName + " <br />" + section.SecArbDiscr + "").on("click", callGroups();


                    });



                    console.log(response);
                },

                error: function (response) {
                    $("#theList").append("<li>error<li>");

                    console.log(response);
                }
            });
        }
    </script>


$（文档）.ready（函数（）{
变灰（）；
});
//$（文档）.on（'pageinit'，函数（）{
函数调用组（ID）
{
$（“#”+ID）.附加（“
第一项
第二项
”）；
}
函数变灰（）{
$.ajax({
类型：“POST”，
url:“CarService.asmx/GetAllsections”，
数据：“{}”，
contentType:“应用程序/json；字符集=utf-8”，
数据类型：“json”，
成功：功能（响应）{
var部分=响应d；
$（“#页码_正文”）。追加（“”）；
$.mobile.initializePage（）；
$。每个（节，函数（索引，节）{
//asd=“listsec”+section.secId；
$（“#列表”）。附加（

“+section.SecName+”+section.SecArbName+”
“+section.SecArbDiscr+”）。在（“单击”，调用组（）；
});
控制台日志（响应）；
},
错误：函数（响应）{
$（“#列表”）。追加（
错误
”；
控制台日志（响应）；
}
});
}

如何在动态列表中构建动态列表？
如果append方法错误，您将
click
事件处理程序添加到循环中的
列表中，而不是新添加的
li
，您可以使用该方法修改代码

$("<li> <a id = '"+section.secId+"' ><img src='pic/" + section.SecImg + "'> <br /> " + section.SecName + '   ' + section.SecArbName + " <br />" + section.SecArbDiscr + "").appendTo('#theList').on("click", callGroups);

$（“

”+section.SecName+”+section.SecArbName+“
”+section.SecArbDiscr+”）。附加到（“#列表”）。单击（“单击”，调用组）；

并将呼叫组更改为

function callGroups(ID) {
    $(this).append("<ul><li> first</li><li>second item</li> </a></li> ");
}

函数调用组（ID）{
$（此项）。追加（“
第一项
第二项
”；
}
以下是答案我尝试了这段代码，它正在工作

 $.each(sections, function (index, section) {

                        var asd = section.SecName;
                        $("#theList").append("<li id='" + asd + "'>  <img src='pic/" + section.SecImg + "'> <br /> " + section.SecName + '   ' + section.SecArbName + " <br />" + section.SecArbDiscr + "");
                        $("#"+asd).append("<ul><li >  <img src='pic/" + section.SecImg + "'> <br /> " + section.SecName + '   ' + section.SecArbName + " <br />" + section.SecArbDiscr + "</li></ul></li>");
                    });

$。每个（节，函数（索引，节）{
var asd=section.SecName；
$（“#列表”）.append（“

“+section.SecName+”+section.SecArbName+”
“+section.SecArbDiscr+”）；
$（“#”+asd）.追加（“

”+section.SecName+”+section.SecArbName+”
“+section.SecArbDiscr+”
”）；
});
它正在工作，但它会不断在同一页面中添加新列表，我希望它被隐藏，当我单击该项目时，新列表将生成并在新页面中打开