Javascript innerHTML vs outerHTML

Question

I have the following javascript:

// create a new article tag
var elem = document.createElement(\'article\');

// append the article to the comments list
docu         


        

Answer 1

I'd say both are probably not what you want, use textContent or else whatever property handles the text for the element.

elem.textContent = "This is the comment";
elem.classList.add("comment"); 

innerHTML parses content as HTML and completely destroys the element and recreates it, it also destroys any event handlers, etc that might be registered for the element. With outerHTML the element set will still hold a reference to the original element (if any).

So both have possible unintended side-effects vs the correct property to set text content.