js appendchild after element code example

Example 1: add div after div jquery

$( "<p>Test</p>" ).insertAfter( $( ".container" ) );

Example 2: jquery append after

<div class="container">
  <h2>Greetings</h2>
  <div class="inner">Hello</div>
  <div class="inner">Goodbye</div>
</div>
<script>$( "<p>Test</p>" ).insertAfter( ".inner" );</script>

Example 3: appendchild javascript

function createMenuItem(name) {
    let li = document.createElement('li');
    li.textContent = name;
    return li;
}
// get the ul#menu
const menu = document.querySelector('#menu');
// add menu item
menu.appendChild(createMenuItem('Home'));
menu.appendChild(createMenuItem('Services'));
menu.appendChild(createMenuItem('About Us'));

Example 4: appendchild javascript

const parent = document.createElement('div');
const child = document.createElement('p');
const childTwo = document.createElement('p');
parent.append(child, childTwo, 'Hello world'); // Works fine
parent.appendChild(child, childTwo, 'Hello world');
// Works fine, but adds the first element and ignores the rest

Example 5: appendchild element once if element presense in js

<script>
       var button = false;
        function  myfun(){
            if ( button === false){
                var b1 = document.createElement("BUTTON");
                b1.innerHTML = "Click Me";
                document.body.appendChild(b1); 
                return button = true;  
            }
      }
    </script>