How correctly ask first child in JavaScript?

Question

My code:

news_divs[i].innerHTML= content.substr(0,this.config.head_length)+"...<div style='display:none'>"+content+"</div>";
news_divs[i].onclick = function(){var child=this.getElementByTagName('div')[0];child.style="display:block;"}

But it return error in last string. Error text:

Uncaught TypeError: undefined is not a function news_div.js:9

news_divs.(anonymous function).onclick

I tested:

news_divs[i].onclick = function(){var child=this.firstChild;child.style="display:block;

and

news_divs[i].onclick = function(){var child=this.children[0];child.style="display:block;

but always get this error.

When I writed (for Example):

news_divs[i].onclick = function(){console.log('test')}

It was work.

news_div isn't undefind.

I think I have error because my ask isn't correct. How do this correct?

Answer 1

It's getElement s ByTagName, with an s, and using addEventListener will give this the right value, also note the way the style is set

news_divs[i].addEventListener('click', function() {
    var child = this.getElementsByTagName('div')[0]; 
    child.style.display = "block";
}, false);