Javascript Jquery.append.after如何格式化.each

我正在努力实现以下目标：

<div class="item">         
    <div class="container-fluid">
        <div class="row">
            <div class="col-md-3">IMG</div>
            <div class="col-md-9">TEXT</div>        
        </div>        
    </div>                    
</div>
<div class="item">         
    <div class="container-fluid">
        <div class="row">
            <div class="col-md-3">IMG</div>
            <div class="col-md-9">TEXT</div>        
        </div>        
    </div>                    
</div> 

IMG
正文
IMG
正文

以下是我到目前为止的情况：

var ws_ftr = data.ws_ftr.records;
    console.log(JSON.stringify(ws_ftr));
    jQuery.each(ws_ftr, function(index, ftr) {
        jQuery('.carousel-inner').append('<div class="item">');
        jQuery('.item').append('<div class="container-fluid">');
        jQuery('.container-fluid').append('<div class="row">');
        jQuery('.row').append('<div class="col-md-3"><img src="img/features_sliding/'+ftr[3] +'" alt="feature-'+ftr[2]+'"/></div><div class="col-md-9"><h2>'+ftr[2]+'</h2>'+ftr[1]+'</div>');

var ws_ftr=data.ws_ftr.records；
log（JSON.stringify（ws_ftr））；
每个（ws_ftr，函数（index，ftr）{
jQuery（'.carousel-inner'）.append（''）；
jQuery（'.item'）.append（''）；
jQuery（'.container fluid'）.append（''）；
jQuery（'.row'）.append（''+ftr[2]+''+ftr[1]+''）；

这给了我这个，我停止在第一个主要错误，因为我相信其他将被纠正，一旦我修复它

<div class="item">
    <div class="container-fluid">
        <div class="row">
            <div class="col-md-3">IMAGE</div>
            <div class="col-md-9">TEXT</div>
            **<div class="col-md-3">IMG</div>
            <div class="col-md-9">TEXT</div>**

形象
正文
**IMG
正文**

这不应该为每个循环提供col-md-3和col-md-9，而是应该为我提供整个项目块

---

我对jQuery/javascript相当陌生，正在不断学习。有人能向我解释一下我做错了什么以及纠正的最佳方法吗？非常感谢！

刚刚注意到，在jQuery中，您从未关闭过任何div。因此，继续编写代码可以这样完成：

   var ws_ftr = data.ws_ftr.records;
        console.log(JSON.stringify(ws_ftr));
        $.each(ws_ftr, function(index, ftr) {
            $('.carousel-inner').append('<div class="item">');
            $('.item').append('<div class="container-fluid">');
            $('.container-fluid').append('<div class="row">');
            $('.row').append('<div class="col-md-3"><img src="img/features_sliding/'+ftr[3] +'" alt="feature-'+ftr[2]+'"/></div><div class="col-md-9"><h2>'+ftr[2]+'</h2>'+ftr[1]+'</div>');
            $('.container-fluid').append('</div>');
            $('.item').append('</div>');
            $('.carousel-inner').append('</div>');

);

var ws_ftr=data.ws_ftr.records；
log（JSON.stringify（ws_ftr））；
$。每个（ws_ftr，函数（索引，ftr）{
$（'.carousel-inner'）。追加（''）；
$（'.item'）。追加（''）；
$（'.container fluid'）。追加（''）；
$（'.row'）.append（''+ftr[2]+''+ftr[1]+''）；
$（'.container fluid'）。追加（''）；
$（'.item'）。追加（''）；
$（'.carousel-inner'）。追加（''）；
);

我相信这也可以通过以下方式完成：

   var ws_ftr = data.ws_ftr.records;
        console.log(JSON.stringify(ws_ftr));
        $.each(ws_ftr, function(index, ftr) {
            $('.carousel-inner').append('<div class="item"></div>');
            $('.item').append('<div class="container-fluid"></div>');
            $('.container-fluid').append('<div class="row"></div>');
            $('.row').append('<div class="col-md-3"><img src="img/features_sliding/'+ftr[3] +'" alt="feature-'+ftr[2]+'"/></div><div class="col-md-9"><h2>'+ftr[2]+'</h2>'+ftr[1]+'</div>');
);

var ws_ftr=data.ws_ftr.records；
log（JSON.stringify（ws_ftr））；
$。每个（ws_ftr，函数（索引，ftr）{
$（'.carousel-inner'）。追加（''）；
$（'.item'）。追加（''）；
$（'.container fluid'）。追加（''）；
$（'.row'）.append（''+ftr[2]+''+ftr[1]+''）；
);

1.不要用多个

.append（）

在单个

.append（）中完成每件事

2.关闭所有你开始的部门

jQuery('.carousel-inner').append('<div class="item"><div class="container-fluid"><div class="row"><div class="col-md-3"><img src="img/features_sliding/'+ftr[3] +'" alt="feature-'+ftr[2]+'"/></div><div class="col-md-9"><h2>'+ftr[2]+'</h2>'+ftr[1]+'</div></div></div></div>');

jQuery（'.carousel-inner'）.append（''+ftr[2]+''+ftr[1]+''）；

注意-似乎是非封闭div造成了问题。
无关：避免使用此
jQuery
，而是使用速记
$
。@Ele，不一定。可能OP使用的是jQuery。noConflict@Phiter好的，这样就完美了。
：）
@laural4705您尝试过我在评论中给出的解决方案了吗是的！！效果很好！非常感谢！！