JSFiddle - React, Tailwind, and code Playground

HTML

<a class="list-group-item allnotif" href="#allnotif"><strong>Alle Notificaties</strong></a>
<a class="list-group-item sedelnotif" href="#sedelnotif">Gelezen & Verwijderd</a>
<a class="list-group-item staffnotif" href="#staffnotif">Staffmededelingen</a>

<div class="jumbotron">
    <div id="allnotif">
        all
    </div>
    <div id="sedelnotif">
        sede
    </div>
    <div id="staffnotif">
        staff
    </div>
</div>

JavaScript

$("#sedelnotif").hide();
$("#staffnotif").hide();

$('.allnotif').click(function() {
    $("#allnotif").show();
    $("#sedelnotif").hide()
    $("#staffnotif").hide()
});

$('.sedelnotif').click(function() {
    $("#sedelnotif").show();
    $("#allnotif").hide()
    $("#staffnotif").hide()
});

$('.staffnotif').click(function() {
    $("#staffnotif").show();
    $("#allnotifn").hide()
    $("#sedelnotif").hide()
});