CODEWITHSUNDEEP
javascriptjquery
AlwaysStudent
AlwaysStudent

Reputation: 1374

click remove added class after second click

How to remove priSCW-active after second click.

The code needs work but when i click second time on the container it is not closing.

What i am missing here anyone can help me in this regard ?

DEMO

$(document).ready(function() {
   $("body").on("click", ".container", function(event) {
      event.stopPropagation();
      var ID = $(this).attr("id");
      $(".priSCWrap").removeClass("priSCW-active");
      $("#open" + ID).toggleClass("priSCW-active").siblings().removeClass('priSCW-active');;
   });
   $("body").click(function(){
         $(".priSCWrap").removeClass("priSCW-active");
    });
});

Upvotes: 1

Views: 124

Answers (3)

Rory McCrossan
Rory McCrossan

Reputation: 337560

If you remove the removeClass() call, then the toggle will achieve what you need for you. At the moment you remove the class and toggle will then always immediately add it back on again. Also note that the .priSCWrap elements are not siblings, so siblings() won't select anything. You need to query those elements again and remove the current from the matched set, to remove any existing priSCWrap-active classes. Try this:

$("body").on("click", ".container", function(event) {
    event.stopPropagation();
    var $current = $(this).find('.priSCWrap').toggleClass("priSCW-active");
    $('.priSCWrap').not($current).removeClass('priSCW-active');
});

Example fiddle

Also note the use of this and find() which negates the need to bodge together an id selector.

Upvotes: 2

KLin
KLin

Reputation: 479

You had to remove this line 

$(".priSCWrap").removeClass("priSCW-active");

Upvotes: 0

Jacek Pietal
Jacek Pietal

Reputation: 2019

$(document).ready(function() {
   var clicked = 0;
   $("body").on("click", ".container", function(event) {
      if (++clicked === 2) {
          // your code
      }
      event.stopPropagation();
      var ID = $(this).attr("id");
      $(".priSCWrap").removeClass("priSCW-active");
      $("#open" + ID).toggleClass("priSCW-active").siblings().removeClass('priSCW-active');
   });
   $("body").click(function(){
         $(".priSCWrap").removeClass("priSCW-active");
    });
});

Upvotes: 2

Related Questions