javascript: add html to end of <span> (noob)

Question

I am sure there must be an easier way that doing this:

foo.innerHTML +="<br>";

The above is producing dirty results as there is a textbox in the SPAN and the data from that textbox gets wiped away when using innerHTML.

I am trying to "re-learn" JS so forgive me if the question is too noobish.

alexP · Accepted Answer · 2014-04-01 13:27:44Z

1

I think this is the neatest way to append a new HTML-Element to another:

HTML

<span id="mySpan">This is my Text</span>

JS

var span = document.getElementById('mySpan');
var br = document.createElement('br');
span.appendChild(br);

answered Apr 1, 2014 at 13:21

alexP

3,7657 gold badges29 silver badges37 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Karim AG · Accepted Answer · 2014-04-01 13:27:05Z

1

Try var br = document.createElement("br"); foo.appendChild(br);

answered Apr 1, 2014 at 13:21

Karim AG

2,19315 silver badges30 bronze badges

This won't work. appendChild needs a node as parameter not a string.

it works but I get this error: Uncaught NotFoundError: Failed to execute 'appendChild' on 'Node': The new child element is null.

Thanks, while you were editing I tried Alex's answer and it worked... i'm upvoting both of you though :)