如何在<pre> tags

Question

So I have a textarea where users can write code. Usual HTML tags (strong, p, b, etc) are rendered without any problems.

Now I would like to use this twitter embed component

But as I see, it does not render anything on the screen.

This is the function that takes the inputted code from the textarea.

function parseHTMLContent(content) {

    var wrapper = document.createElement('div');
    var div = wrapper.innerHTML= "<pre>"+content.toString()+"</pre>";

    return(div);

}

And this is how I render it.

<div className="article_content" dangerouslySetInnerHTML={{__html: parseHTMLContent(this.state.content)}}>
</div>

How can I handle it like this when someone inputs this Twitter Embed component that it would render as it should.