[VanillaJS] 비동기 div 내용변경

document.addEventListener("DOMContentLoaded", function () {
  const list_add_button = document.querySelectorAll(".list-add-button");
  var parser = new DOMParser();


  list_add_button.forEach((tag) => {
    tag.addEventListener("click", function () {
      var xhttp;
      if (window.XMLHttpRequest) {
        xhttp = new XMLHttpRequest();
      } else {
        // IE5, IE6 일때
        xhttp = new ActiveXObject("Microsoft.XMLHTTP");
      }

      xhttp.open("POST", "/cisum/addlist/", true);
      xhttp.setRequestHeader(
        "Content-type",
        "application/x-www-form-urlencoded"
      );

      let data = tag.getAttribute("data-id");
      xhttp.send("data=" + data);
      xhttp.onload = function () {
        if (xhttp.readyState == 4 && xhttp.status == 200) {
          var responseDoc = parser.parseFromString(xhttp.responseText, "text/html");
          document.getElementById("playlist-body").innerHTML = responseDoc.getElementById("playlist-body").innerHTML;
        }
      };
    });
  });
});

 사용법은 알아서