Function to display html code rather than display elements in browser using Javascript

Question

I want to have the innerHTML of my div element to contain some HTML code, rather than displaying the expected result of that html as the browser normally would. How do I do this using Javascript?

Answer 1

With normal JavaScript:

var div = document.getElementById('foo');
while (div.firstChild) {
  div.removeChild(div.firstChild);
}
div.appendChild(document.createTextNode(html));

With jQuery:

$('#foo').text(html);