/getTsk GET
/addTsk POST
/delTsk POST

<!-- Pending task loads here -->
<!-- On reload, everything in this div is deleted -->
<!-- The tasks div are then added into this div -->
<div id="pendingTasks"></div>

function saveTasks(value) {
let request = new XMLHttpRequest();
request.onreadystatechange = function () {
    if (request.readyState == request.DONE) {
        if (request.status === 200) {
            reloadPending(); //If sucessfully added task, then reload the corresponding div
            showAlert("New Task Added.", "alert-success");
        } else {
            showAlert("Failed to Add New Task, Please try again later.", "alert-danger");
        }
    }
};
request.open("POST", ep_prefix + "/addTsk");
request.setRequestHeader("Content-type", "application/json");
request.send(JSON.stringify({ description: value }));
}

function reloadPending() {
let content = document.getElementById("pendingTasks");
content.innerHTML = "";

makeGetRequest("GET", "/getTsks", initPending, showEmptyPending, "?status=0"); //Get all the task from backend again
}

//Population of the entries
let fragment = document.createDocumentFragment();
console.log(tasks.length);
for (let i = 0; i < tasks.length; i++) {
    console.log(tasks[i]);
    let taskElements = createTask(tasks[i], "pending");
    fragment.appendChild(taskElements);
}
document.getElementById("pendingTasks").appendChild(fragment);

[task #N (created 2017-11-21 09:55)] Ask question on SE