How can I make a document.getElementById() to work in Netbeans ?

I got the solution now, thanks Brendan

Once again, please help me to check these code below because when I add new item to the list it is supposed to be checkBox at ToDo list but it displayed text box.

/*

• To change this license header, choose License Headers in Project Properties.
• To change this template file, choose Tools | Templates
• and open the template in the editor. */

/* DOM tree is Document Object Model */

/* user interaction doesn't provide desired result

• solution is to make intereactivity to program*/

var taskInput = document.getElementById("new-task"); // new task var addButton = document.getElementsByTagName("button")[0]; // first button var incompleteTaskHolder = document.getElementById("incomplete-tasks"); //incomplete-tasks var completeTaskHolder = document.getElementById("completed-tasks");;// complete-tasks

//new task list item var createNewTaskElement = function(taskString){ var listItem = document.createElement("li"); //input (checkbox) var checkBox = document.createElement("input");// checkbox //label var label = document.createElement("label");

//input (text)
var editInput = document.createElement("input");//text
//button.edit
var editButton = document.createElement("button");
//button.delete
var deleteButton = document.createElement("button");
//each elements need modifying

checkBox.Type = "checkbox";
editButton.Type = "text";

editButton.innerText = "Edit";//modify the newParagraph element's text 
editButton.className = "edit";
deleteButton.innerText = "Delete";
deleteButton.className = "delete";

label.innerText = taskString;
 //each elements need appending
listItem.appendChild(checkBox);
  listItem.appendChild(label);
   listItem.appendChild(editInput);
    listItem.appendChild(editButton);
     listItem.appendChild(deleteButton);

return listItem;

};

//add a new task var addTask = function(){ console.log("Add task..."); //create new list item woth text from new task var listItem = createNewTaskElement(taskInput.value);

//Append listItem to incompleteTaskHolder incompleteTaskHolder.appendChild(listItem); bindTaskEvents(listItem, taskCompleted);

 taskInput.value = "";

};

//Edit new listing task var editTask = function(){ console.log("Edit task...");

var listItem = this.parentNode;

var editInput = listItem.querySelector("input[type=text]"); var label = listItem.querySelector("label");

var containClass = listItem.classList.contains("editMode"); //if the class of parent is editMode if(containClass){ label.innerText = editInput.value;

 }else {
     //switch to .editmode
    //input value becomes label' text
     editInput.value = label.innerText;
 }

 //toggle .editMode on the parent 
 listItem.classList.toggle("editMode");
 };

// Delete new listing tasks var deleteTask = function(){ console.log("Delete task..."); //when delete button is pressed

var listItem = this.parentNode;
var ul = listItem.parentNode;

  //Remove parent list item from the ul
  ul.removeChild(listItem);

}; //Mark a task as complete var taskCompleted = function(){ console.log("Task complete..."); //append task list item to the #completed-tasks var listItem = this.parentNode; completeTaskHolder.appendChild(listItem); bindTaskEvents(listItem, taskIncompleted); }; //Mark a task as incomplete var taskIncompleted = function(){ console.log("Task incomplete..."); //append the task item to #incompleted-tasks var listItem = this.parentNode; incompleteTaskHolder.appendChild(listItem); bindTaskEvents(listItem, taskCompleted); };

var bindTaskEvents = function(taskListItem, checkBoxEventHandler){
    console.log ("Bind this item event");

    var checkBox = taskListItem.querySelector("input[type=checkbox]");
    var editButton = taskListItem.querySelector("button.edit");
    var deleteButton = taskListItem.querySelector("button.delete");

    //bind editTask to editButton
    editButton.onclick = editTask;
    //bind deleteTask to deleteButton
    deleteButton.onclick = deleteTask;
    //bind checkBoxEventHandler to checkbox
    checkBox.onchange = checkBoxEventHandler;
};

//set click handler
addButton.onclick = addTask;

//cycle over incompletedTasksHolder ul list items
for ( var i = 0; i < incompleteTaskHolder.children.length; i++){
    //bind event to list item's children (taskCompleted)
   bindTaskEvents(incompleteTaskHolder.children[i], taskCompleted);
}




//cycle over incompletedTasksHolder ul list items
for ( var i = 0; i < completeTaskHolder.children.length; i++){
    //bind event to list item's children (taskCompleted)
   bindTaskEvents(completeTaskHolder.children[i], taskIncompleted);
}