How to insert an element after another element in javascript <html> <head> <style> header,footer,div{ padding:5px 10px; margin:6px auto; } </style> </head> <body> <p>How to insert an element after another element in javascript.</p> <header id="header"> This is a header. </header> <footer id="footer"> This is a footer. </footer> <script> const myHeader = document.querySelector('#header'); const newDiv = document.createElement('div'); newDiv.innerText = "My new div element." myHeader.parentNode.insertBefore(newDiv,myHeader.nextSibling) </script> </body> </html>
How to insert an element after another element in javascript <html> <head> <style> header,footer,div{ padding:5px 10px; margin:6px auto; } </style> </head> <body> <p>How to insert an element after another element in javascript.</p> <header id="header"> This is a header. </header> <footer id="footer"> This is a footer. </footer> <script> const myHeader = document.querySelector('#header'); const newDiv = document.createElement('div'); newDiv.innerText = "My new div element." myHeader.parentNode.insertBefore(newDiv,myHeader.nextSibling) </script> </body> </html>