jquery附加问题

我得到了这个代码的附加问题。在我的xml中，我使用了2个“listgroup”和jquery打印属性。但在搜索“列表组”中，第一组包含6个点，第二组包含6个点。这两个部分必须单独打印到“ul”元素

但我的问题是第一次，当它在我得到的第一个ul中打印12个点时，它在第二个ul中打印6品脱

我想要的是，第一个ul必须有6个点，第二个ul在xml树中有6个点

$(function(){
    $.get('career-utility.xml',function(myData){

    $(myData).find('listgroup').each(function(index){
          var listGroup = $(this);
          var listGroupTitle = $(this).attr('title');
          var shortNote =   $(this).attr('shortnote');
          var subLink   = $(this).find('sublist');
          var firstList = $(this).find('list');

          $('.grouplist').append('<div class="list-group"><h3>'+listGroupTitle+'</h3><ul class="level">'+index+'</ul></div>');

         $(this).children().each(function(num){
            var text = $(this).text();
            $('<li>'+text+'</li>').appendTo('ul.level');
        })
    })

    })    
})

$（函数（）{
$.get（'career-utility.xml'，函数（myData）{
$（myData）.查找（'listgroup'）。每个（函数（索引）{
var listGroup=$（此值）；
var listGroupTitle=$（this.attr（'title'）；
var shortNote=$（this.attr（'shortNote'）；
var subLink=$（this.find（'sublist'）；
var firstList=$（this.find（'list'）；
$（'.grouplist'）。追加（''+listGroupTitle+'
'+index+'
'）；
$（this）.children（）.each（函数（num）{
var text=$（this.text（）；
$（“
”+text+“
”）.appendTo（'ul.level'）；
})
})
})    
})

编辑：

请参阅下面的编辑，但可能您正试图更改每个

ul.level

的

class

属性。如果是这种情况，您需要执行以下操作：

-->向右滚动查看正在使用索引号更新的类-->

---

编辑：更详细地解释问题。

第一关 将新容器附加到文档中

<div class="list-group">
    <h3>first title</h3>
    <ul class="level">0</ul>
</div>

<div class="list-group">
    <h3>first title</h3>
    <ul class="level">0
        <li>first pass - first child</li>
        <li>first pass - second child</li>
        <li>first pass - third child</li>
        <li>first pass - fourth child</li>
        <li>first pass - fifth child</li>
        <li>first pass - sixth child</li>
    </ul>
</div>
<div class="list-group">  // New Container here
    <h3>second title</h3>
    <ul class="level">1</ul>
</div>

---

我想，你对我的解释不对。我的问题是xml中有2个“列表组”。每个“列表组”每个包含6个点。我想将每个“列表组”点打印到单独的2个uls。如果我发出警报，我会得到正确的结果，但当我打印时，第一个ul打印2组点（12点），第二个打印6点。为什么第一次ul打印12分？如何避免？你试过我的解决方法吗？问题在于这一行

$（'
'+text+'
'）。appendTo（'ul.level'）。您正在将
+text+
添加到页面上的
ul.level
的每个实例中。所以第二次，两个
ul.level
元素都得到了您要附加的子元素。这就是为什么前者的数量是后者的两倍。我会更新我的答案，尝试解释更多。你解释的是正确的。让我试试这个。。谢谢你的进步！
$(function(){
    $.get('career-utility.xml',function(myData){

    $(myData).find('listgroup').each(function(index){
          var listGroup = $(this);
          var listGroupTitle = $(this).attr('title');
          var shortNote =   $(this).attr('shortnote');
          var subLink   = $(this).find('sublist');
          var firstList = $(this).find('list');

          var $newElement = $('<div class="list-group"><h3>'+listGroupTitle+'</h3><ul class="level">'+index+'</ul></div>');
          var $newUL = $newElement.find('ul.level');

         $(this).children().each(function(num){
            var text = $(this).text();
            $newUL.append('<li>'+text+'</li>');
        });

        $('.grouplist').append( $newElement );
    })

    })    
})

<div class="list-group">
    <h3>first title</h3>
    <ul class="level">0</ul>
</div>

<div class="list-group">
    <h3>first title</h3>
    <ul class="level">0
        <li>first pass - first child</li>
        <li>first pass - second child</li>
        <li>first pass - third child</li>
        <li>first pass - fourth child</li>
        <li>first pass - fifth child</li>
        <li>first pass - sixth child</li>
    </ul>
</div>

<div class="list-group">
    <h3>first title</h3>
    <ul class="level">0
        <li>first pass - first child</li>
        <li>first pass - second child</li>
        <li>first pass - third child</li>
        <li>first pass - fourth child</li>
        <li>first pass - fifth child</li>
        <li>first pass - sixth child</li>
    </ul>
</div>
<div class="list-group">  // New Container here
    <h3>second title</h3>
    <ul class="level">1</ul>
</div>

<div class="list-group">
    <h3>first title</h3>
    <ul class="level">0
        <li>first pass - first child</li>
        <li>first pass - second child</li>
        <li>first pass - third child</li>
        <li>first pass - fourth child</li>
        <li>first pass - fifth child</li>
        <li>first pass - sixth child</li>
        <li> second pass - first child</li>
        <li> second pass - second child</li>
        <li> second pass - third child</li>
        <li> second pass - fourth child</li>
        <li> second pass - fifth child</li>
        <li> second pass - sixth child</li>
    </ul>
</div>
<div class="list-group">
    <h3>second title</h3>
    <ul class="level">1
        <li> second pass - first child</li>
        <li> second pass - second child</li>
        <li> second pass - third child</li>
        <li> second pass - fourth child</li>
        <li> second pass - fifth child</li>
        <li> second pass - sixth child</li>
    </ul>
</div>