Javascript JSRailsAPI删除按钮

我有一个带有JavaScript前端的RAILS API。我正在尝试创建一个删除按钮来删除内容。我在处理请求时遇到了麻烦。如果需要，我可以共享存储库

我只是想让删除按钮，当一个新的内容卡被放入删除条目本身时，它会被呈现出来。我似乎无法理解这一点

在创建项时呈现按钮的World JavaScript

display() {

  // display post details in a card in the post-lists   
  let deleteBtn = document.createElement('button')
  deleteBtn.setAttribute('class', 'delete-world-btn')
  deleteBtn.innerText = 'Remove'
  deleteBtn.addEventListener('click', event => this.deleteWorld(event, this))
  document.getElementsByClassName("character-lists")[0].innerHTML += this.template();
}

deleteWorlds() {
  event.preventDefault()
  fetch(`${deleteUrl}/${this.id}`, {
    method: "DELETE"
  }).then(() => { 
    document.getElementById(`${this.id}`).remove()
    World.all = World.all.filter(world => world.id !== this.id)
  })
}

Index.js-DOM

function addClickEventToPostListHeader() {
  document.querySelector('.character-lists h3').addEventListener('click', changeColor);
}

function addSubmitEventToForm() {
  document.getElementById("character-form").addEventListener('submit', Api.submitWorld);
}

document.addEventListener('DOMContentLoaded', function () {
  // We have access to all of the DOM elements
  addSubmitEventToForm();
  Api.getWorlds();
});

你的星球在哪里？
地球家园信息

---

我真的很喜欢使用“删除”按钮来删除单个内容条目。

您的html结构是什么？你的星球在哪里？Home Planet信息您添加的html代码段和删除操作之间似乎没有关系。请粘贴完整的上下文。