Skip to main content Accessibility Feedback

DOM Injection

Element.before()

Insert elements and strings before another element. Call the Element.before() method on the node you want to insert before, and pass in one or more new elements or strings as arguments.

<div id="app">Good evening</div>
// Create a new element
let p = document.createElement('p');
p.textContent = 'Hello!';

// Get the target node
let app = document.querySelector('#app');

// Insert the new node before the target node
// <p>Hello!</p><div id="app">Good evening</div>
app.before(p);

// You can inject more than one item by passing in multiple arguments
// <p>Hello!</p>What's poppin'<div id="app">Good evening</div>
app.before(p, `What's poppin?`);

Preorder my new course on Web Components! Want to learn how to build Web Components from scratch, master best practices, and more? Preorder today and get $100 off of the launch price.


Find this useful? You can support my work by purchasing an annual membership.