Cannot read property 'appendChild' of null. Javascript

Question

I'm following a tutorial online on how to make a to do list. found here

https://www.youtube.com/watch?v=MURDw0-BiEE

I've following it perfectly, but it won't work. Browser states the 'appendChild' is null. The tutorial is 2 years old, is it just script that has been outdated?

Really appreciate the help

function addNewItem() {
    var listItem = document.createElement("li");
    listItem.innerText = "Hello";

    list.appendChild(listItem);
}

var btnNew = document.getElementById("btnAdd");
btnNew.onclick = function() {
    addNewItem(document.getElementById("todoList"));
};

and here's the related part of the html

<p><button id="btnAdd">New Item</button></p>

<ul id="todolist">
</ul>

<script src="todo.js"></script>

You need to show your own code, not what you say you've followed "perfectly." Without the code you're actually running, we can't troubleshoot anything for you. FWIW, no, the code in the video is not outdated--it'll work fine. — JAAulde
– JAAulde, Commented Jun 15, 2014 at 5:11

JAAulde · Accepted Answer · 2014-12-29 16:31:33Z

4

You wrote addNewItem and invoked it in a manner which expects that it should take a parameter named list but you never added it as a param in the function definition. This should straighten you up:

function addNewItem(list) {

as opposed to your

function addNewItem() {

edited Dec 29, 2014 at 16:31

answered Jun 15, 2014 at 21:16

JAAulde

19.5k5 gold badges56 silver badges65 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Cannot read property 'appendChild' of null. Javascript

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related