If I have a textarea including some HTML code, how can I write a JavaScript function to show the HTML output instead of HTML code itself, for example:

<textarea id="mytextarea">
<table border=1><tr><td>cellone</td>td>celltwo</td></tr></table
</textarea>
<input type=button onclick="HTMLoutput();"/>

<script>
HTMLoutput()
{
//Code to show html output instead of html code in textarea
}
</script>

How can I do this? What is the suggested code to write inside the HTMLoutput()?

If I have a textarea including some HTML code, how can I write a JavaScript function to show the HTML output instead of HTML code itself, for example:

<textarea id="mytextarea">
<table border=1><tr><td>cellone</td>td>celltwo</td></tr></table
</textarea>
<input type=button onclick="HTMLoutput();"/>

<script>
HTMLoutput()
{
//Code to show html output instead of html code in textarea
}
</script>

How can I do this? What is the suggested code to write inside the HTMLoutput()?

• javascript
• textarea

• possible duplicate of How can I show HTML formatting inside a textarea? – DevlshOne Commented Oct 18, 2013 at 3:23

2 Answers 2

So to convert the the html code to a formated html you need to do:

$('resultDiv').append($('<div/>').html($('.txtArea').val()+"<br>");

here's an example that use div with contentEditable set to true.

It sounds like you're asking how to take some HTML and display its rendered result in your document.

That's exactly what the innerHTML property does.
Simply pick a DOM element to display the result in, and set its innerHTML to the HTML to display.