jQuery：子供を数えて文字列として表示

Question

私はかなり単純だと思うことをしようとしています。ページの読み込み時に、ulの子をすべてカウントし、その数値を文字列として表示したいとします。ここで私はこれまで持っているコードです：

jQueryの

$('ul').load(function() { 
    var txt = "1" + "/" + $("> *", this).length; 
    $(".counter").html(txt); 
}); 

HTML

<ul> 
    <li><img alt="Photo" src="images/photo.png" /></li> 
    <li><img alt="Photo" src="images/photo.png" /></li> 
    <li><img alt="Photo" src="images/photo.png" /></li> 
</ul> 

<p class="counter"></p> 

したがって、この例では、ページが読み込まれたら、p.counterは「文字列が含まれますが1/3 "となる。私がここで間違っていることを確かめない。

Answer 1

文書のアイテムを準備しているのはなぜですか？

$(document).ready(function() { 
    var txt = "1"+ "/" + $("ul li").length; 
    $(".counter").html(txt); 
}); 

例：http://jsfiddle.net/jtbowden/But8C/

Answer 2

まず、私はあなたが特定のユニークなULを意味すると仮定します。その場合、ページに他のulが表示された場合の競合を避けるために、IDを与えることをお勧めします（下の「ulid」としてリストされています）。カウンターでも同じことをしたいかもしれませんが、他のクラスでそのクラスを使用していないと確信できる場合は、うまくいくはずです。

$(document).ready(function() { 
    var txt = "1/" + $("#ulid").children().length() 
    $("p.counter").html(txt); 
}