[Solved] How to toggle css visibility with Javascript

by


Basically your Javascript could be shortened to:

$(".question").click(function(argument) {  
    $(this).parent().find(".answer").removeClass("hideinit").addClass("display");
});

In order to make this work the only other thing you need to do is to make question a class rather than as an id. That looks like:

<p class="answer hideinit">the answer</p>

See the fiddle here

Edit: Add Hide / Show

To get this to hide and show as expected you’ll want to update the code to check the current class before hiding and showing. That looks like:

$(".question").click(function(argument) {  
    var el = $(this).parent().find(".answer");
    if (el.hasClass("display")) {
       el.removeClass("display").addClass("hideinit");
    } else {
        el.removeClass("hideinit").addClass("display");
    }
});

See the fiddle here

2

solved How to toggle css visibility with Javascript