Question

Consider the following simple HTML:

<div id="navcontainer">
        <a href="#"><img alt="" src="Img1.jpg" /></a>
        <a href="#"><img alt="" src="Img2.jpg" /></a>
        <a href="#"><img alt="" src="Img3.jpg" /></a>
        <a href="#"><img alt="" src="Img4.jpg" /></a>
        <a href="#"><img alt="" src="Img5.jpg" /></a>
</div>

And for the sake of argument, let’s say it’s a very small portion of a large page with many DIV’s and A’s.

What I want to do is hide the tags and the images inside them. If I do this, it works:

$('a').hide();

But like I said, there are a lot of links on the page, so I want to be very specific. Essentially, I want ONLY the links that are inside a <div> with the class of “navcontainer”. So from what I’m seeing on the web, it should be one of the following two formats. The second one looks perfect to me. But neither is working for me.

$('div.navcontainer a').hide();
$('div.navcontainer > a').hide();

I must be missing something stupid. Can anyone please clue me in?

Answer 1

You mixed up the class and Id selector

$('#navcontainer a').hide();
$('#navcontainer > a').hide();