JSFiddle - React, Tailwind, and code Playground

by Newton Anbarasu

HTML

<input type="checkbox" id="set_1" checked> click to show text1
<p class = "wpbook_hidden wpbook_option_set_1"> This is option one</p>
<p class = "wpbook_hidden wpbook_option_set_1"> This is another option one</p>
<input type="checkbox" id="set_2"> click to show text1
<p class = "wpbook_hidden wpbook_option_set_2"> This is option two</p>

JavaScript

$('.wpbook_hidden').hide();

$(':checkbox').change(function() {
    changeCheck(this);
});

$(':checkbox:checked').each(function(){
    changeCheck(this);
});

function changeCheck(x) {
    var option = 'wpbook_option_' + $(x).attr('id');
    if ($('.' + option).is(':visible')) {
        $('.' + option).fadeOut();
    }
    else {
        $('.' + option).fadeIn();
    }
}