CodePen Embed - Append and prepend child node using JavaScript

<ol>
  <li>AAA</li>
  <li>BBB</li>
  <li>CCC</li>  
</ol>

html {
  background: #fbdf00;
  font-size: 20px;
}

let ol = document.querySelector("ol");

/* Append child element and add text content to it */
ol.appendChild(document.createElement("li")).textContent = "appended";

/* Prepend child element and add text content to it*/
ol.insertBefore(document.createElement("li"), ol.firstChild).textContent = "prepended";

This Pen is owned by Envato Tuts+ on CodePen.

See more by @tutsplus on CodePen

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.