在克隆過程中更改div的文本

Question

我用ajax調用追加了div ，為此我創建了一個虛擬div ， cloning了div並根據存在的JSON數據放置了數據。 我做了一個假的太（ 小提琴 ）。 每次我在div中將“ a”作為文本輸入時，都會出現這種情況。 我想如果JSON具有特定值，則應更改文本（根據i的值為4時，則文本應為“ b”而不是“ a”）..怎么做。 以下是我的代碼（我的代碼太大，因此我要放置虛擬表單）.. HTML：

<div class="wrp"></div>
<div class="childd"></div>

CSS：

.wrp{
  background-color:#aaf;
  border:1px solid orange;
  float:left;width:100%
}
.wrp .child{
  float:left;
  height:20px;
  width:20px;
  background-color:#77c;
  border:1px solid #cdcdcd;
}
.childd{
  height:20px;
  width:20px;
  background-color:#cdcdcd;
}

JS：

$('.childd').on('click',function(){
    for(i=0;i<=9;i++){
        $('.childd')
            .clone()
            .removeClass('childd')
            .addClass('child')
            .html('a')
            .appendTo('.wrp');
    }    
})

小提琴

Answer 1

如果願意，可以將函數傳遞給html() 。 當然，返回值將是所應用的：

$('.childd').on('click',function(){
    for(i=0;i<=9;i++){
        $('.childd')
            .clone()
            .removeClass('childd')
            .addClass('child')
            .html(function(){
                return i==4 ? 'b' : 'a'   
            })
            .appendTo('.wrp');
    }    
})

的jsfiddle

---

如果要在.html()中返回一個克隆的元素，可以使用完全相同的方法來完成此操作：

.html(function(){
    return i==4 ? $(elem).clone() : 'a'
})