js Web component example of Document.createElement()

Example 1: create custom html element

class className extends HTMLElement{//or any othere element you want
	contructor(){
    super()//to call the parent class contructor
      this._root = this.attachShadow({mode:"open"})//attach a shadow dom for easy manipulation
      connectedCallback(){
      	//runs code everytime the element is used on the html page
      }
      disconnectedCallback(){
      	//runs everytime the element is removed from the dom
      }
      adoptedCallback(){
      	//runs everytime the element is moved
      }
      attributeChangedCallback(nameOfAtr, oldValue, newValue){
      	//runs everytime the elements attributes are changed in any way
      }
    }
}
window.customElements.define("what you want your tag name to be",class name of tag)//to add the custom element and be able to add in in html

Example 2: document create element

document.body.onload = addElement;

function addElement () { 
  // create a new div element 
  var newDiv = document.createElement("div"); 
  // and give it some content 
  var newContent = document.createTextNode("Hi there and greetings!"); 
  // add the text node to the newly created div
  newDiv.appendChild(newContent);  

  // add the newly created element and its content into the DOM 
  var currentDiv = document.getElementById("div1"); 
  document.body.insertBefore(newDiv, currentDiv); 
}