I manage to delete button with `<li>` element `class li_listItem"`. But my aim is to on click delete `<button>` itself and also `<li>` element with it. For now I can only delete both elements only by clicking on it. Can you help me with it?

```js
var ul = document.querySelector('#shopping_list__items');

function DeleteButtonOnclick(e) {
  const trgt = e.target.closest('.deleteBtn, .li_listItem');
  if (trgt) trgt.remove();
}

ul.addEventListener("click", DeleteButtonOnclick);
```

```html
<ul id="shopping_list__items">
  <div class="flex">
    <li class="li_listItem" random="23">Notebook</li>
    <button class="deleteBtn">Delete Button</button>
  </div>

  <div class="flex">
    <li class="li_listItem">Jello</li>
    <button class="deleteBtn">Delete Button</button>
  </div>

  <div class="flex">
    <li class="li_listItem">Spinach</li>
    <button class="deleteBtn">Delete Button</button>
  </div>

  <div class="flex">
    <li class="li_listItem">Rice</li>
    <button class="deleteBtn">Delete Button</button>
  </div>

  <div class="flex">
    <li class="li_listItem">Birthday Cake</li>
    <button class="deleteBtn">Delete Button</button>
  </div>

  <div class="flex">
    <li class="li_listItem">Candles</li>
    <button class="deleteBtn">Delete Button</button>
  </div>
</ul>
```