Drag the edges to resize the window.

In Projects, you can keep track of your progress as you go throught the tasks. Check each item as you complete it!

Code Editor
Web Browser
JavaScript and the DOM


In order to toggle the projects in each section, we will need to use $(this) to select the button we clicked on. The issue is that $(this) refers to the projects-button in our current code, and not the projects themselves.

We need a way to select the projects elements next to the button that we clicked.

Luckily, jQuery can select elements logically. In index.html, notice that the projects-button element is directly followed by the projects list. Therefore the projects element is next after it.

jQuery has a function named next to help us select elements that are next to another element. If we have this in our HTML:

<div class='item-one'> ... </div> <div class='item-two'> ... </div>

If we wanted to hide item-two, we could write:

  1. We can attach next to any jQuery selector to select the next direct element.
  2. Then, we can attach any jQuery function to next(). In this case, we attached hide, which would hide the next element after the $('.item-one') element.
Report a Bug
If you see a bug or any other issue with this page, please report it here.