From the course: JavaScript Code Challenges: Creating Web Apps

Unlock this course with a free trial

Join today to access over 25,300 courses taught by industry experts.

Static task creation

Static task creation

- [Instructor] Let's add the functionality to add tasks to our to-do column. So what we need, we need to get the task from task inputs and let's get all the columns from our page with the selectors. So let's start with that on top. And you can see, I'm using the querySelectorAll to get all the elements that have the class column. Then I need to have a few functions. And the first one I need is my create task element. So let's create a function for that, createTaskElement. What will I need? Well, I'm going to need a text and I'm going to have an ID that by default I'll set to the current time. And there we go, toString. And then, in here, I need to do a few things. Let's go ahead and create my task with documents.createElement. And I'm going to make my task a little div. There we go. I already have the CSS for this, so it will look good. And I'm going to set my class name to task 'cause that's needed for the CSS. And then let's go ahead and set the text content to the text that was…

Contents