Question

my question was pretty much explained up in the title. How do I get HTML tags inside of a Javascript Text Node? The result of my code on the page is…

<a href="http://www.example.com">Click Here</a>

However, I want “Click Here” to be a link. I am new to Javascript, so this would help me out a lot. Below is an example of what I’m talking about…

<div id="mydiv">
</div>
<script type="text/javascript">
var mynode=document.createTextNode('<a href="http://www.example.com">Click Here</a>');
document.getElementById('mydiv').appendChild(mynode);
</script>

Answer 1

You can’t put links in a text node. Links are elements. Elements can (sometimes) contain text nodes, but the reverse is not true.

You need to create an element, set attributes on it, then append text to that element.

var link = document.createElement('a');
link.setAttribute('href', 'http://www.example.com');
link.appendChild(document.createTextNode('Click Here'));
document.getElementById('mydiv').appendChild(link);