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 jQuery Basics (2014) Creating a Mobile Drop Down Menu Perform: Part 3

Savannah Lynn
Savannah Lynn
13,662 Points

Why are we changing the value to the boolean value of true?

I am confused about this part of the video. We are saying if we have a li with the class of selected, we change the option class from "selected" to the boolean value of true. Why are we doing this? How does the browser know that this now means the same thing as the CSS class "selected"? Also, since we wrote the html element <option></option> in JavaScript, it never had a class of "selected" to begin with?

if ($anchor.parent().hasClass("selected")) { $option.prop("selected", true); }

Html has a little bit of logic on its own. Without JavaScript you can specify which item in the dropdown is selected by adding the property "Selected". example: <option selected>Drop down list entry</option>. The JavaScript code in the video is looking at the parent's classes and if the class is "Selected" then it adds "selected" to the html dropdown list which in turn tells your browser to select that item in the list with a property of selected.

1 Answer

The code is actually setting the attribute value selected not the class selected. The value true means it will make the html element have the selected attribute and the value false means it wont have the selected attribute. http://www.w3schools.com/tags/att_option_selected.asp