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 Simple Lightbox Perform: Part 1

Anthony c
Anthony c
20,907 Points
Posted by Anthony c
Anthony c
20,907 Points

why is there an "a" in this code: $("#imageGallery a").click(function(event){

$("#imageGallery a").click(function(event)

I understand we're calling out an ID with #imageGallery but I don't know why that "a" is included in "#imageGallery a"

3 Answers

Marcus Parsons
Marcus Parsons
15,719 Points

Hi Anthony,

jQuery uses query selectors that function exactly the same as CSS selectors. So, if you think of "#imageGallery a" in terms of CSS, you know that we're targeting the anchor links (<a> elements) within the element with the id of "imageGallery" because we have the id and then a space and then the name of an element.

Each anchor link in the "imageGallery" element contains the reference to the image you're going to use for the lightbox. The instructor could have just as easily set a click handler on the <img> elements in the "imageGallery" element (because they each contain a reference to the image too), but he decided to keep the handler addressed to links.

Does that make sense?

Anthony c
Anthony c
20,907 Points
Anthony c
Anthony c
20,907 Points

Yes, definitely. Thanks Marcus.

Marcus Parsons
Marcus Parsons
15,719 Points

Excellent. You're very welcome, Anthony. Do you have any more questions?

Daniel Newman
PLUS
Daniel Newman
Courses Plus Student 10,715 Points
Daniel Newman
Daniel Newman
Courses Plus Student 10,715 Points

Most of the code with "a" tag is made for cross-compatability for the situation when there is no ability to make it with jQuery or for the search engine webcrawler. The percent of such case decrese month by month but cross-compatability in not about majority but whole usecases.

Daniel Newman
Daniel Newman
Courses Plus Student 10,715 Points

welcome