<style>.accordion { display: none; }
input.accordion:checked + .accordion { display: block; border: 1px solid black; padding: 0.2em; }
</style>
<label for="x1">first accordion</label>
<br><input type="radio" class="accordion" name="group" id="x1">
<div class="accordion">sometimes, discovering how to do this in basic html is fun</div>
<label for="x2">second accordion</label>
<br><input type="radio" class="accordion" name="group" id="x2">
<div class="accordion">and remembering when people used to do jquery stuff like $("fart").toggle()</div>
<label for="x3">third accordion</label>
<br><input type="radio" class="accordion" name="group" id="x3">
<div class="accordion">and how sometimes, the simplest solution is the easiest</div>
this trick has worked since css3 or whatever it was
edit: notably, this doesn't work on cohost or anywhere else you don't have the ability to affect stylesheets, much like, well, most html
