javascript - カウントが 9 または 6 または 3 になるまで新しい div を追加します

Question

クラス foo または 6 または 3 を持つ 9つの divが必要 です。 これら
の 3 つの数字である必要があり ます2 なら 3 まで、7 なら 9 まで数えます

これはjsfiddleの私のコードです

http://jsfiddle.net/H6bky/

これはhtml

<div id="content">
  <div class="foo">foo</div>
  <div class="foo">foo</div>
  <div class="foo">foo</div>
  <div class="foo">foo</div>
</div>

そしてこれはcssコードです

#content{
width: 510px;  
background: #ccc;
height: 800px;
}

.foo{
width: 150px;
height: 100px;
background: #808080;
margin: 10px;
float: left;
}

ありがとうございました

Answer 1

http://jsfiddle.net/H6bky/1/

$(document).ready(function(){
onePostlength = $(".foo").length;
if (onePostlength < 9 && onePostlength % 3 !=0)
{
    while ($(".foo").length % 3 != 0)
    {
      $("#content").append('<div class="foo" />');  
    }
}
});

Answer 2

モジュロ演算子を使用する

var current = $("div.foo").length;
while((current % 3) != 0) {     // 3 can be any other number
    $("#content").append("<div class='foo'>foo</div>");
    current++;
}

Answer 3

var n = 3 - (document.querySelectorAll('.foo').length % 3),
content = document.getElementById('content'),
div, i;

for (i=0; n<3 && i<n; i++) {
    div = document.createElement('div');
    div.className = 'foo';
    div.appendChild(document.createTextNode('foo'));

    content.appendChild(div);
}

要素の長さを.foo調べ、3 の倍数がない場合は、さらに div を挿入します。