计算所有div元素并使用jQuery在span内添加每个数字

Question

我需要按顺序显示页面中每个div的数量

并在范围内添加每个div的值

所以，如果我在页面内有4个div，就像这样

<div>first div</div>
<div>second div</div>
<div>third div</div>

每个div都需要显示他的订单并且像这样

<div>first div <span>1</span></div>
<div>second div <span>2</span></div>
<div>third div <span>3</span></div>

这个jsfiddle中的html示例代码

http://jsfiddle.net/CtDLe/

我需要输出使用jQuery

http://jsfiddle.net/CtDLe/1/

Answer 1

简单的each循环可以解决问题：

$("div").each(function(i) {
    $(this).find("span").text(++i);
});

演示：http://jsfiddle.net/CtDLe/3/

Answer 2

$("div").each(function(idx,elem) {
    $("<span>").text(idx).appendTo(wherever);
});

Answer 3

你可以试试这个：

$("div").each(function(i, elem){
 $(elem).append($("<span>"+(i+1)+"</span>"));
});

JSFiddle example

Answer 4

var counter = 1;
$('h1').each(function () {
    $(this).find('span').html(counter);
    counter++;
});

<强> jsFiddle example