Developmentn of functions seems backwards. Why is this order?

/** THIS IS THE CORRENT FILE
 * Created by mikekyllo on 1/16/17.
 */
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 completedTaskHolder = document.getElementById("completed-tasks"); //completed-tasks

//Add a new task
var createNewTaskElement = function(){
    var newTask = document.createElement("li");
    //input (checkbox)
    var checkBox = document.createElement("input"); //checkbox
    //label
    var label = document.createElement("label");
    //input(text)
    var editInput = document.createElement("input");
    //button.edit
    var editButton = document.createElement("button");
    //button.delete
    var deleteButton = document.createElement("button");
    //Each element needs modifying

    //Each element needs appending
    newTask.appendChild(checkBox);
    newTask.appendChild(label);
    newTask.appendChild(editInput);
    newTask.appendChild(editButton);
    newTask.appendChild(deleteButton);

    return newTask
}


// Add a new task
var addTask = function() {
    console.log("Add task...")

    var newTask = createNewTaskElement("Some new task");
    //Append newTask to incompleteTaskHolder
    incompleteTaskHolder.appendChild(newTask);
    bindTaskEvents(newTask, taskCompleted);
}

// Edit an existing task
var editTask = function() {
    console.log("Edit Task...");
}

// Delete a task
var deleteTask = function() {
    console.log("Delete task...");
}

// Mark a task as complete
var taskCompleted = function() {
    console.log("Task complete...");
    var newTask = this.parentNode;
    completedTaskHolder.appendChild(newTask);
    bindTaskEvents(newTask,taskIncomplete);
}

// Mark a task as incomplete
var taskIncomplete = function() {
    console.log("Task incomplete...");
    var newTask = this.parentNode;
    incompleteTaskHolder.appendChild(newTask);
    bindTaskEvents(newTask,taskCompleted);
}

var bindTaskEvents = function(taskListItem, checkBoxEventHandler){
    console.log("bind list item events");
//Select newTask's children
    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 checknboxEventHandler to checkbox
    checkbox.onchange = checkBoxEventHandler;
}


//set the click handler to the addTask function

addButton.onclick = addTask

//Cycle over incompleteTaskHolder ul list items
for(var i = 0; i < incompleteTaskHolder.children.length; i++) {
    bindTaskEvents(incompleteTaskHolder.children[i], taskCompleted);
}
//Cycle over completeTaskHolder ul list items
for(var i = 0; i < completedTaskHolder.children.length; i++) {
    bindTaskEvents(completedTaskHolder.children[i], taskIncomplete);
}