How to insert HTML content without overwrite the default content with JS [duplicate]

Question

I have footer code below. I want to add some html content (see below) but if I do it, the default content disappear. I want to keep default content and add the new one. How to do that?

<div id="footer">
HTML content and some classes
</div>

And my code to add another HTML content with classes:

<script>
document.getElementById('footer').innerHTML = '<div class="bannery"><img class="obrazek" src="URL"></div>';
</script>

Thank you :-)

Added this answer to the dupetarget, as it didn't have the obvious answer. — T.J. Crowder
– T.J. Crowder, Commented Jul 19, 2018 at 21:47

CodePerson71495 · Accepted Answer · 2018-07-19 21:28:06Z

3

Try this : document.getElementById('footer').innerHTML += '<div class="bannery"><img class="obrazek" src="URL"></div>'; That should work

answered Jul 19, 2018 at 21:28

CodePerson71495

691 silver badge4 bronze badges

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

4 Comments

epascarello Over a year ago

Issue with this is if there is event handlers, you remove them.

CodePerson71495 Over a year ago

It is supposed to add inject HTML to the element with the footer id

CodePerson71495 Over a year ago

Usually works for me

epascarello Over a year ago

It will add it, just saying there are side effects to this solution.

Collectives™ on Stack Overflow

How to insert HTML content without overwrite the default content with JS [duplicate]

1 Answer 1

4 Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

4 Comments

Linked

Related