JSFiddle - React, Tailwind, and code Playground

by dima_k

HTML

<body>
    <p>Prev sibling</p>
    <ul id="myList">
        <li>First child</li>
        <li>Second child</li>
        <li>Third child</li>
    </ul>
    <p>Next sibling</p>
</body>

JavaScript

debugger;
var list = document.getElementById('myList');

var newLi = document.createElement('li');
var newText = document.createTextNode('New child');
newLi.appendChild(newText);
// append new node
//list.appendChild(newLi);

// insert new node as first node
list.insertBefore(newLi, list.firstChild);

// replace second child
//list.replaceChild(newLi, list.children[1]);

// remove third child
list.removeChild(list.lastElementChild);