removeEventListener not working.

#webdev #javascript #beginners

I don't seem to understand why I can't remove the event listener where I added a text through insertAdjacentText when clicked. I really hope someone helps me. I've gone through hours trying to debug it.

const header = document.querySelector(`header h1`);
const button = document.querySelector(`header button`);

function addText() {
   header.insertAdjacentText(`afterend`, `Yeah`);
   console.log(`yeah`);
}

header.addEventListener(`click`, addText);
button.removeEventListener(`click`, addText);

Top comments (4)

Vesa Piittinen • Dec 10 '20

My guess of what you want is this:

const header = document.querySelector(`header h1`);
const button = document.querySelector(`header button`);

function addText() {
   header.insertAdjacentText(`afterend`, `Yeah`);
   console.log(`yeah`);
   button.removeEventListener(`click`, addText);
}

button.addEventListener(`click`, addText);