[解決済み】クラス名で子要素を取得する方法は？

質問

class = 4 の子スパンを取得しようとしています。以下は、要素の例です。

<div id="test">
 <span class="one"></span>
 <span class="two"></span>
 <span class="three"></span>
 <span class="four"></span>
</div>

私が使えるツールは、JSとYUI2です。こんな感じのことができます。

doc = document.getElementById('test');
notes = doc.getElementsByClassName('four');

//or

doc = YAHOO.util.Dom.get('#test');
notes = doc.getElementsByClassName('four');

これらはIEでは動作しません。オブジェクト（doc）がこのメソッドまたはプロパティ（getElementsByClassName）をサポートしていないというエラーが表示されます。私はgetElementsByClassNameのクロスブラウザ実装のいくつかの例を試しましたが、私はそれらを動作させることができず、まだそのエラーが表示されました。

必要なのはクロスブラウザのgetElementsByClassNameか、doc.getElementsByTagName('span')を使ってクラス4を見つけるまでループさせる必要があると思います。しかし、私はそれを行う方法はよくわかりません。

どのように解決するのですか？

使用方法 doc.childNodes を繰り返し実行するために、それぞれの span を持つものをフィルタリングします。 className と等しい 4 :

var doc = document.getElementById("test");
var notes = null;
for (var i = 0; i < doc.childNodes.length; i++) {
    if (doc.childNodes[i].className == "4") {
      notes = doc.childNodes[i];
      break;
    }        
}