How to get elements of specific class inside a div already found in JavaScript?

Question

What I need is to find a div with particular id, then find any element with particular class inside it and make the first of them invisible. I have tried

var hostDivName = "theHostDivName";
var hostDiv = document.getElementsByName(hostDivName);
var theElements = hostDiv.getElementsByClassName("theClassDivName");
theElements[0].style.display = "none";

But it fails on hostDiv.getElementsByClassName("theClassDivName"); with

Object #<NodeList> has no method 'getElementsByClassName'

error.

So what is the right way? I'd prefer using pure JavaScript (rather than jQuery or whatever) as far as this seems reasonable.

Answer 1

If it's an ID, why are you using getElementsByName and not getElementById

var hostDivName = "theHostDivName";

var hostDiv = document.getElementById(hostDivName);

var theElements = hostDiv.getElementsByClassName("theClassDivName");

theElements[0].style.display = "none";

Assuming you meant name, and not ID

var hostDiv = document.getElementsByName(hostDivName)[0];