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 JavaScript and the DOM (Retiring) Getting a Handle on the DOM Practice Selecting Elements

Indu khan
Indu khan
169 Points
Posted by Indu khan
Indu khan
169 Points

WHats wrong in this plss explain

WHats wrong in this plss explain

js/app.js 
let navigationLinks = document.querySelectorAll('nav a');
let galleryLinks = document.querySelectorAll('ul #gallery');
let footerImages;
index.html 
<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Nick Pettit | Designer</title>
    <link rel="stylesheet" href="css/normalize.css">
    <link href='http://fonts.googleapis.com/css?family=Changa+One|Open+Sans:400italic,700italic,400,700,800' rel='stylesheet' type='text/css'>
    <link rel="stylesheet" href="css/main.css">
    <link rel="stylesheet" href="css/responsive.css">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
  </head>
  <body>
    <header>
      <a href="index.html" id="logo">
        <h1>Nick Pettit</h1>
        <h2>Designer</h2>
      </a>
      <nav>
        <ul>
          <li><a href="index.html" class="selected">Portfolio</a></li>
          <li><a href="about.html">About</a></li>
          <li><a href="contact.html">Contact</a></li>
        </ul>
      </nav>
    </header>
    <div id="wrapper">
      <section>
        <ul id="gallery">
          <li>
            <a href="img/numbers-01.jpg">
              <img src="img/numbers-01.jpg" alt="">
              <p>Experimentation with color and texture.</p>
            </a>
          </li>
          <li>
            <a href="img/numbers-02.jpg">
              <img src="img/numbers-02.jpg" alt="">
              <p>Playing with blending modes in Photoshop.</p>
            </a>
          </li>
        </ul>
      </section>
      <footer>
        <a href="http://twitter.com/nickrp"><img src="img/twitter-wrap.png" alt="Twitter Logo" class="social-icon"></a>
        <a href="http://facebook.com/nickpettit"><img src="img/facebook-wrap.png" alt="Facebook Logo" class="social-icon"></a>
        <p>&copy; 2016 Nick Pettit.</p>
      </footer>
    </div>
  <script src="js/app.js"></script>
  </body>
</html>

2 Answers

Steven Parker
Steven Parker
231,269 Points
Steven Parker
Steven Parker
231,269 Points

The challenge asks you to select all links in the unordered list with the id of "gallery", but the selector 'ul #gallery' would target "the element with an id of "gallery" that is inside an unordered list".

Remember that the item(s) being selected are the last thing in a combined selector, and that links are represented by "a" (anchor) elements.

Tray Denney
PLUS
Tray Denney
Courses Plus Student 12,884 Points
Tray Denney
Tray Denney
Courses Plus Student 12,884 Points

You were very close but there is a slight issue with how you are approaching selecting the element. I believe you are targeting any #gallery inside of an unordered list and instead you need to target all of the links inside of #gallery.

Try :

let navigationLinks = document.querySelectorAll('nav a');
let galleryLinks = document.querySelectorAll('#gallery a');
let footerImages;
Steven Parker
Steven Parker
231,269 Points
Steven Parker
Steven Parker
231,269 Points

I should point out that you can't have "any #gallery". Since id's are required to be unique, there can only be one item with that id on the page. So when targeting by id, no additional filters are ever necessary or useful.