How to append to innerHTML without destroying descendants’ event listeners with JavaScript?

Spread the love

Sometimes, we want to append to innerHTML without destroying descendants’ event listeners with JavaScript.

In this article, we’ll look at how to append to innerHTML without destroying descendants’ event listeners with JavaScript.

How to append to innerHTML without destroying descendants’ event listeners with JavaScript?

To append to innerHTML without destroying descendants’ event listeners with JavaScript, we can concatenate to it.

For instance, we write

const htmlToInsert = "<p>New paragraph</p>";

document.getElementById("mydiv").innerHTML += htmlToInsert;

to select the wrapper element with getElementById.

Then we append to its innerHTML property to append new HTML to it.

Conclusion

To append to innerHTML without destroying descendants’ event listeners with JavaScript, we can concatenate to it.

Leave a Reply

Your email address will not be published. Required fields are marked *