如題，動態(tài)創(chuàng)建10個span標(biāo)簽循環(huán)在div里<div class="square"></div><script>    var str="<span></span>";    for(var i=0;i<10;i++){        $(".square").append(str);    }</script>…… .square{        width:400px;        height: 200px;        border:1px solid red;        position: relative;    }    .square span{        width:10px;        height:10px;         background:blue;        position: absolute;        bottom:0;    }    .square span:nth-child(2){        left:12px;    }    .square span:nth-child(3){        left:24px;        background：red;    }    .square span:nth-child(4){        left:36px;    }…………好像創(chuàng)建的span都堆在一起了，現(xiàn)在想讓每個標(biāo)簽向左移動，后面的標(biāo)簽且疊加前一次的移動距離，我是用的css給每個標(biāo)簽left移動,不過這樣太繁瑣了，如果要循環(huán)生成30幾個標(biāo)簽豈不是累死。js動態(tài)應(yīng)該怎么寫forEach嗎？求解？