"Uncaught TypeError: can't access property "addEventListener", filterOption is null"

[cboyardeat]

Hi all,

This is probably a very stupid mistake as I am still a newbie to JS.

But could anyone point me in the right direction as to what I’m doing wrong here?

https://codepen.io/cboyardeat/pen/RwpGeaO
“Uncaught TypeError: can’t access property “addEventListener”, filterOption is null”

[Catalactics]

Hey @cboyardeat ,

In your code, the variable filterOption is getting an HTML tag from the DOM using querySelector, but inside the query selector, you didn’t use class or id to specify what to get:

//Selectors
const todoInput = document.querySelector('.todo-input');
const todoButton = document.querySelector('.todo-button');
const todoList = document.querySelector('.todo-list');
const filterOption = document.querySelector('filterTodo'); 
// If you look at above, the filterTodo is not a class nor id.

And if you look at your HTML, there is no element with a class or id of filterTodo there is an element with a class of filer-todo

[cboyardeat]

Ah yes! Ofcourse!

Can’t believe I didn’t see that myself…

Thanks