JSFiddle - React, Tailwind, and code Playground

HTML

<div class=box id=js-box>box</div>
<div class=box id=js-another-box>another box</div>

<div class=controls>
    <a href=# class=show-link data-target=#js-box>Toggle "Box"</a>
    &bull;
    <a href=# class=show-link data-target=#js-another-box>Toggle "Another Box"</a>
</div>

CSS

body{
    font:1.4em Segoe UI;
}
.box{
    width:100px;
    height:100px;
    background:#c33;
    margin:10px;
    float:left;
    color:white;
    text-align:center;
}

.controls{
    clear:both;
}

JavaScript

jQuery(function ($) {

     var cached = {}; // hierin gaan we de elementen vasthouden

     $('.show-link').on('click', function (e) {
         var target = $(this).data('target');
         console.log(target);

         if (cached[target]) { // als hij al gecached is
             target = cached[target]; // zoek hem niet opnieuw op, gebruik de cache
         } else { // de eerste keer
             target = cached[target] = $(target); // zoek element op en cache hem
         }

         target.toggle();
     });

 });