Hiding only select members of a class
I'm trying to hide all elements that are members of my "content" class EXCEPT one member which I don't want to hide. I can't add ID's the the DIVs I want to hide because I'm already using the IDs to do something else.
Here's my jQuery code:
-
<script src="js/jquery-1.2.5.min.js"></script>
<script>
// When the document loads do everything inside here ...
$(document).ready(function(){
// When a link is clicked
$("a.tab").click(function () {
// switch all tabs off
$(".active").removeClass("active");
// switch this tab on
$(this).addClass("active");
// slide all content up
$(".content").hide();
// slide this content up
var content_show = $(this).attr("title");
$("#"+content_show).fadeIn("slow");
});
});
</script>
As you can see, when a tab is clicked, it hides everything in the content class then displays the element with the same ID as the title contained in the <a> tag on the tab.
But the thing is that I'm using two sections of content and when I click on the tabs in this box it hides the content in
both boxes which is the opposite of what is good.
Here's what my page looks like. When you click a tab in the music box, it closes the content in the thoughts box. I need to avoid that somehow.. perhaps an exception so it doesn't close every div in the "content" class?