在jQuery中使用for循环添加HTML代码

Question

我正在尝试将html代码中的li元素添加到div元素，以下是我的html代码：

放置要添加元素的位置：

<div class="form-body" id="nitspopupmenu"></div>

ul的元素：

<div class="collapse navbar-collapse">
    <ul class="nav navbar-nav navbar-right" id="nitsmenu" data-nitspagelabel="1">
        <li class="scroll active"><a href="#navigation">Home</a></li>
        <li class="scroll"><a href="#aboutus">About Us</a></li>
        <li class="scroll"><a href="#services">Services</a></li>
        <li class="scroll"><a href="#ourteam">Our Team</a></li>
        <li class="scroll"><a href="#portfolio">Portfolio</a></li>
        <li class="scroll"><a href="#clients">Clients</a></li>
        <li class="scroll"><a href="#blog">Blog</a></li>
        <li class="scroll"><a href="#contact">Contact</a></li>
    </ul>
</div>

我的Jquery代码：

$(e).fadeIn(400);

$('#nitspagesorter').fadeIn(400).css({
    'top': mouseY,
    'left': mouseX
}).draggable();

$('#nitsmenubutton').hide();

var licount = $("#nitsmenu li").length;
for (i = 0; i < licount; i++) {
    var lielem = $("#nitsmenu li").text();
    var element = $(lielem).text();
    $("#nitspopupmenu").html("<div class='form-group'><div class='pagesmenu selected'><span><i class ='fa fa-bars'></i>" + lielem + "");
}

我将内容弹出到弹出框中，我li正确地获取了名称，但其仅显示了最后一个元素，即Contact， $("#nitspopupmenu").html("<div class='form-group'><div class='pagesmenu selected'><span><i class ='fa fa-bars'></i>" + lielem + "");最后正在执行，或者可能每次都替换内容并显示最后的结果

请帮忙

Answer 1

我想你应该append()用完html()

for (i = 0; i < licount; i++) {
    var lielem = $("#nitsmenu li").text();
    var element = $(lielem).text();
    $("#nitspopupmenu").append("<div class='form-group'><div class='pagesmenu selected'><span><i class ='fa fa-bars'></i>" + lielem + "");
}

您应该将所有字符串都放在一行中，如果需要多行，则用+号concat

Answer 2

.html() 替换元素的内容，用于.append()添加。

您还需要编写有效的HTML。您有三个开始标记，那里缺少它们的结束标记。