JSFiddle - React, Tailwind, and code Playground

HTML

<ol id="guestList">
    <li class="guestInput">test1</li>
    <li class="guestInput">test2</li>
    <li class="guestInput">test3</li>
</ol>
<button type="button" id="submit">OK</button>

JavaScript

var add = document.createElement("button");
add.type = "button";
add.innerHTML = "+";
add.addEventListener("click", function() {
    var http = new XMLHttpRequest();
        
    http.onreadystatechange = function() {
        if (http.readyState == 4 && http.status == 200) {
            var newChild = document.createElement('li');
            newChild.className = 'guestInput';
            newChild.innerHTML = "test";
            document.querySelector("#guestList").appendChild(newChild); 
            addRemoveButton(document.querySelectorAll(".guestInput").length-1);
        }
    }

    currentLength = document.querySelectorAll(".guestInput").length;
    http.open("GET","/", true);
    http.send();
});

var submit = document.querySelector("#submit");
submit.parentNode.insertBefore(add, submit);

var inputs = document.querySelectorAll(".guestInput");
for (var i = 0; i < inputs.length; i++) {
    addRemoveButton(i);
}

function addRemoveButton(index) {
    var removeButton = document.createElement("button");
    removeButton.type = "button";
    removeButton.className = "remove";
    removeButton.innerHTML = "x";
    removeButton.dataset["index"] = index;
    document.querySelectorAll(".guestInput")[index].appendChild(removeButton);
    
    document.querySelectorAll(".remove")[index].addEventListener("click", function() {
        this.parentNode.parentNode.removeChild(this.parentNode);
    });
}