Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

JavaScript

Can anyone help fix my code?

The issue: when you check or uncheck the checkbox to get it to be appended to the incomplete tasks or complete tasks you've to double click it and when you click it the first time the li elements are swapped inside their container ul.

Here is a snapshot of the workspace: https://w.trhou.se/0hbqywgovp

If anyone could solve my problem that would be fantastic!

1 Answer

Hi Joel, I think the issue is in these lines of code:

// Mark a task as complete
var taskCompleted = function () {
  console.log("Taskcomplete...");
  //append the task li to the #completed-tasks
 var listItem = this.parentNode;
  incompleteTasksHolder.appendChild(listItem);
  bindTaskEvents(listItem, taskIncomplete);
}

//Mark a task as incomplete
var taskIncomplete = function () {
  console.log("Task incomplete...");
  //append the task li to the #incomplete-tasks
  var listItem = this.parentNode;
  completedTasksHolder.appendChild(listItem);
  bindTaskEvents(listItem, taskCompleted);
}

It seems you have these the wrong way around, notice in your comment you have "mark a task as complete" but in your code you are appending it to the incompleteTasksHolder and vice versa in your "mark a task as incomplete" code. Try changing them around like so:

// Mark a task as complete
var taskCompleted = function () {
  console.log("Taskcomplete...");
  //append the task li to the #completed-tasks
 var listItem = this.parentNode;
  completedTasksHolder.appendChild(listItem); //append to completedTasksHolder
  bindTaskEvents(listItem, taskIncomplete);
}

//Mark a task as incomplete
var taskIncomplete = function () {
  console.log("Task incomplete...");
  //append the task li to the #incomplete-tasks
  var listItem = this.parentNode;
  incompleteTasksHolder.appendChild(listItem); //append to incompleteTasksHolder
  bindTaskEvents(listItem, taskCompleted);
}

Hope that helps!!!