удалите родительский элемент, нажав кнопку внутри него «более одного раза» с помощью VanillaJS

Question

, так что у меня есть ul, полный lis, каждый li содержит более одного элемента, подобного этому Остальные из них я пробовал много решений, лучшее, что у меня получилось, это удаление только первого элемента, больше ничего, пожалуйста, помогите

, это мой JS код для кнопки удаления, списки - это динамически добавляемые элементы, и я поместили их в массив в надежде удалить или отредактировать их

 deletBtn.addEventListener('click', function(e){
        this.parentNode.parentNode.parentNode.remove();
        var target = e.target;
        let itemIndex = 0;
        for (const item of items){
            if (item.index === target.parentNode.parentNode.index){
                items.splice(item.index, 1); 
                items.Children[item.index].remove();
                break;
            }
            itemIndex++;
        }    

Answer 1

Вам нужно только дважды (а не трижды) подняться в дереве DOM, чтобы найти <li> предка <button>.

this.parentNode.parentNode.remove();

Демо:

document.querySelectorAll('button').forEach(btn => btn.addEventListener("click", function(e){
    this.parentNode.parentNode.remove();
}));

<ul>
  <li>
     <div>
        <p>some text </p>
        <button>delete</button>
        </div>
    </li>
    <li>
      <div>
        <p>some other text </p>
        <button>delete</button>
        </div>
     </li>
</ul>