document.getElementsByClassName()[removed] always returns “undefined”

Question

I must have made a mistake somewhere so the document.getElementsByClassName().innerHTML is always returning undefined.

First i generate

Answer 1

document.getElementsByClassName() returns a nodeList, not an element!

So it should be :

document.getElementsByClassName('hidden')[0].innerHTML

and as you probably have more .hidden elements, and only want the one inside the current .box (which would be this in the event handler)

this.getElementsByClassName('hidden')[0].innerHTML

but why not jQuery

$(".box").click(function(){
        alert( $('.hidden', this).html() );
});