EN
JavaScript - append multiple HTML elements at once
0
points
In this article, we would like to show you how to append multiple HTML elements at once using JavaScript.
Quick solution:
element.append(chlidElement1, childElement2, childElementN);
Warning:
append()method appeard in the major web browsers around 2016-2018.
Practical example
In this example, we create new child elements and use append() method to append them at once to the container element.
// ONLINE-RUNNER:browser;
<!doctype html>
<html>
<body>
<div id="container"></div>
<script>
var container = document.querySelector('#container');
// create children elements
var newChild1 = document.createElement('div');
var newChild2 = document.createElement('div');
// set children text
newChild1.textContent = 'new child 1';
newChild2.textContent = 'new child 2';
// append children to the container
container.append(newChild1, newChild2);
</script>
</body>
</html>