To Do List with JS

JavaScript
1

Hello I have been trying to create a To Do List with JavaScript, but there’s a problem when I try to see if it works, because if you try to add a list, it won’t do nothing and Console Log doesn’t show any error.
Delete and Checked don’t work yet as i haven’t come to that part yet, but i’m trying to see if “Add” button will work when I will write anything in input box but it doesn’t work ?
https://codepen.io/beh4r/pen/NmpEgB

2

I see a couple things:

  1. In Line 4 of your JS, you have a variable called btn2, but in line 7 you reference a variable called btn
  2. Lines 1-4 you use getElementsByClassName which returns an array, not just one element: https://developer.mozilla.org/en-US/docs/Web/API/Document/getElementsByClassName – I’d recommend adding ids to the HTML elements and then using getElementById instead: https://developer.mozilla.org/en-US/docs/Web/API/Document/getElementById
3

thank you updated my code as you said but still doesn’t work and it shows an error saying
“Uncaught TypeError: Cannot read property ‘insertAdjacentHTML’ of null
at HTMLSpanElement.addToDoItem**”

4

I might be looking at the wrong version of your code (looking at the codepen link you originally posted) and I see you made most of the changes I mentioned in my first comment, but it looks like you didn’t make the change:

So while you’re using document.getElementById your html elements don’t have ids to match. (See link I gave previously for examples on how to use it)

5

updated my code now check it :wink:

6

you still have let list = document.getElementById('myUL'); when myUL is still a class: <ul class="myUL">

7

finally it’s solved thank you a lot for your time to fix it for me :slight_smile: