Chris TheriotFront End Web Development Techdegree Student 8,175 Points
I am having trouble completing this code challenge. I do not know how to use the :hidden selector.
I did my own research online but I still cannot see or understand what I am doing wrong. The lesson before this challenge covered how to use specific selectors but did not cover using the :hidden selector. I tried my best to use the methods taught when using other selectors when trying to get this one to work but I am at a loss now. Any help or guidance would be greatly appreciated!
<!DOCTYPE html> <html lang="en"> <head> <title>Document</title> <link rel="stylesheet" href="style.css" type="text/css" media="screen" title="no title" charset="utf-8"> </head> <body> <h2>Star Trek Characters</h2> <ul class="character-list"> <li>Captain Jean Luc Picard</li> <li>Data</li> <li>Worf</li> <li>Dr. Crusher</li> </ul> <div>I am supposed to stay hidden!</div> <script src="jquery-3.2.1.min.js"></script> <script src="app.js"></script> </body> </html>
const hidden = $('<li>:hidden'); hidden.show();
Jonathan GrieveTreehouse Moderator 87,406 Points
Straight away it looks to me like a problem trying to select an element that has a pseudo selector. :-)
Instead of storing it in a variable try passing the selector directory to the
show() method and select the
:hidden pseudo selector the same way you would with CSS!