Question

I am new to jQuery and I may be going about this the wrong way. I am trying to target a div that has been toggled. The first event handler works fine (open), but I am unable to get the second to work (close). Any help would be greatly appreciated.

$(".entry .tog").unbind();
  $(".entry .tog").click(function(){
        $(this).closest(".entry").toggleClass("entry-active entry");
        $(".entry").toggleClass("entry not-active");

        alert("open");
})

$(".entry-active .tog").unbind();
  $(".entry-active .tog").click(function(){
        $(this).closest(".entry-active").toggleClass("entry-active entry");
        $(".not-active").toggleClass("not-active entry");

        alert("close");
    })
});

Answer 1

I expect that you’re trying to achieve this :

$(".entry .tog").off('click').on('click', function() {
    var $entry = $(this).closest(".entry").toggleClass("active");
    $(".entry").not($entry).removeClass("active");
    alert($entry.hasClass('active') ? "active" : "not active");
});

Notes:

• There’s no point having two classes working in antiphase. In every respect, whether it is CSS styling or jQuery selection, one class will suffice.
• You don’t want to toggle class entry. If you did, the first time entry was toggled off (ie. the class was removed) the elements would become unselectable again with $(".entry"). One day, that might be desirable but not here, I suspect.