From the course: jQuery Essential Training

Unlock this course with a free trial

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

Solution: Dynamic element visibility

Solution: Dynamic element visibility - jQuery Tutorial

From the course: jQuery Essential Training

Solution: Dynamic element visibility

(upbeat instrumental music) - [Instructor] All right. So for this challenge, we needed to write some jQuery code to let the user show and hide different product categories. And just as a reminder, we'll scroll down. You should be seeing some behavior where if you check, and uncheck these check boxes, products should be showing and hiding. So let's take a look at my solution. And again, remember, it's okay if your solution is different from mine. So let's go to the code, and let's scroll past my code for a second. So remember down here in the products section, each one of these H2 tags that represents the product has a data type attribute that indicates the type of product that it is. It's either a vitamin or a mineral water or a protein bar. So let's take a look at my script. So my code starts by adding event listeners to each of the check boxes to listen for the change event. This event is fired whenever the checked status of the checkbox changes. The event handler function then…

Contents