I have a problem, I can't remove the event listener in the condition inside the callback function.

I have the impression that the syntax is correct. But the event is still active.

Does anyone know how to remove the event touchstart?

mutation.target.removeEventListener("touchstart",(e) => { handleClickButton(e) }, true);

const headerSearchBox = document.querySelector(".search-box");

function handleClickButton(event) {
    event.preventDefault();
    alert("You Clicked on the button")
}
    
const mutationCallback = function (mutationList) {
  mutationList.forEach((mutation) => {
    let isSearchOpen = mutation.target.classList.contains("search-container");
    
    // If Search Bar is Open : Do This...
    if (mutation.type === "attributes" && isSearchOpen && mutation.oldValue.includes("open")) {
      console.log("Search Bar is Open");
      mutation.target.addEventListener("touchstart",(e) => { handleClickButton(e) }, true);
    } else {
      console.log("Search Bar is Close");
      mutation.target.removeEventListener("touchstart",(e) => { handleClickButton(e) }, true);
    }
  });
};

const observer = new MutationObserver(mutationCallback);

observer.observe(headerSearchBox, {
  attributes: true,
  attributeOldValue: true,
  attributeFilter: ["class"],
});

Thanks for your support