CODEWITHSUNDEEP
javascriptjqueryhtml
supersize
supersize

Reputation: 14773

Hide element which is not a certain class

I want to hide an element which is not a certain class via jQuerys not() :

 <a href="#" id="c_1" class="content-btn">Content 1</a>
 <a href="#" id="c_2" class="content-btn">Content 2</a>

 <div class="post-item c_1"></div>
 <div class="post-item c_2"></div>

and

var thisContent;
jQuery('.content-btn').click(function() {
    thisContent = this.id;
    jQuery('.post_item').not('.'+thisContent).fadeOut();
}

am I using .not() method wrong in this context, because it seems not to work!

Upvotes: 0

Views: 73

Answers (3)

Mohamed-Yousef
Mohamed-Yousef

Reputation: 24001

as @AND Finally noticed modify your selector .. and while you use click on Anchor you need to use e.preventDefault; try this

jQuery('.content-btn').click(function(e) {
    e.preventDefault;
    thisContent = this.id;
    jQuery('.post-item').not('.'+thisContent).fadeOut();
    $('.'+thisContent).fadeIn();
});

DEMO

Upvotes: 0

And Finally
And Finally

Reputation: 5704

Your selector needs to be

jQuery('.post-item')

And you need to close the ) at the end of your jQuery, like this:

var thisContent;
jQuery('.content-btn').click(function() {
    thisContent = this.id;
    jQuery('.post-item').not('.'+thisContent).fadeOut();
});

See http://codepen.io/anon/pen/EaNXjg for a working example.

Upvotes: 3

user4171365
user4171365

Reputation:

Try using 

$(element).hasClass(".clasname").fadeOut();

Upvotes: 0

Related Questions