JSFiddle - React, Tailwind, and code Playground

by TimFogarty

HTML

<input type=checkbox class="physics"> Physics
    <br>
    <input type=checkbox class="art"> Art
    <br>
    <input type=checkbox class="phil"> Philosophy
        
    <div class="courses">
        <div class="physics">Phys course 1</div>
        <div class="physics">Phys course 2</div>
        <div class="art">Art course 1</div>
        <div class="art">Art course 2</div>
        <div class="phil">Phil course 1</div>
        <div class="phil">Phil course 2</div>
    </div>

CSS

.courses div {
    display: none;
}

JavaScript

$('input').click(function(){
    // Possibly some ajax in here to get course info
    var c = $(this).attr('class');
    $(".courses ."+c).toggle();
});