使用ajax迭代器动态填充json数据到div

如何解决使用ajax迭代器动态填充json数据到div

尝试按顺序显示特定 div 中的一些数据。我有来自 servlet 的 json 响应，我想在迭代器中动态填充 ajax 中的这些数据。我的响应数据包含 [area1,name1] [area2,name2] Html 部分是

<div class="col-lg-6" id="container">
    <section class="panel" id="divdata">
    <header class="panel-heading" id="dt1">area1</header>
                    <div class="panel-body">

                        <P>name1</P>
                    </div>
    <header class="panel-heading" id="dt1">area2</header>
    <div class="panel-body">

        <P>name2</P>

    </div>
</section> 
</div>

my ajax portion is

 $.each(data2,function(i,obj) {
           
           var area2='"'+data2[i].area+'"';

             alert(area2);    
                var section = $('<section>',{
                    "class": "panel"
                  });
                var header = $('<header>',{
                    "class": "panel-heading"
                  });
                var div = $('<div>',{
                    "class": "panel-body"
                  });
                section.append(header);
                section.append(div);
                section.appendTo(".container")

           });
    }

但它不起作用。请帮助我