javascript element.style is undefined in FF

Question

I want to set up css display property in javascript code:

  var div = document.createElement('div'); div.innerHTML = content; div.childNodes[0].style.display = ''; 

It works in IE but doesn't in FF. It says "style" is undefined for element div. How can I do it in FF?

Thanks

Answer 1

What is content ? If it starts with white space, then there will be a TextNode as the first child and they don't have style properties (HTMLElementNodes do).

You can either:

• loop over the children until you either get to the end or find an HTMLElementNode
• strip the whitespace from the start of content
• switch to using createElement and friends instead of innerHTML

Answer 2

This should also work:

var div = document.createElement('div');
div.innerHTML = content;
div.childElementCount && div.firstElementChild.style.display = '';