Comment obtenir un élément enfant par nom de classe ?

Question

J'essaie d'obtenir le span enfant qui a une classe = 4. Voici un exemple d'élément :

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

Les outils dont je dispose sont JS et YUI2. Je peux faire quelque chose comme ceci :

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

//or

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

Ils ne fonctionnent pas dans IE. Je reçois une erreur indiquant que l'objet (doc) ne prend pas en charge cette méthode ou cette propriété (getElementsByClassName). J'ai essayé quelques exemples d'implémentations de getElementsByClassName dans d'autres navigateurs, mais je n'ai pas réussi à les faire fonctionner et j'ai toujours obtenu cette erreur.

Je pense que ce dont j'ai besoin, c'est d'un getElementsByClassName dans le navigateur ou d'utiliser doc.getElementsByTagName('span') et de boucler jusqu'à ce que je trouve la classe 4. Je ne suis pas sûr de savoir comment faire cela.