HTML DOM insertAdjacentElement() Method

The insertAdjacentElement() method inserts the specified element at the specified position. The legal values for this position are.

afterbegin
afterend
beforebegin
beforeend

Syntax:

node.insertAdjacentElement(position, element)

Parameters: This method requires 2 parameters.

position: A position relative to the element. The legal values are :-
1. afterbegin: Just inside the element, before its first child.
2. afterend: After the element itself.
3. beforebegin: Before the element itself.
4. beforeend: Just inside the element, after its last child.
element: The element you want to insert.

Return Value: The element that was inserted, or null, if the insertion failed.

Exceptions: If the specified position is not recognized or if the specified element is not a valid element.

Example:

HTML

<!DOCTYPE html>
<html>
<head>
    <!--script to insert specified
        element to the specified position-->
    <script>
        function insadjele() {
            var s = document.getElementById("d1");
            var h = document.getElementById("head3");
            
            h.insertAdjacentElement("afterend", s);
        }
    </script>
</head>
  
<body>
    <h1> Welcome To GeeksforGeeks</h1>
    <div id="d1">div element</div>
    <h3 id="head3">header element</h3>
    <p>Click the button to insert 
      div element after the header element</p>
    <button onclick="insadjele()">Insert element</button>
  
</body>
</html>