JSFiddle - React, Tailwind, and code Playground

by TheFiddler

HTML

Shelf<input type="checkbox" class="subscription-checkboxes" value="shelf" /><br>
VS Shelf<input type="checkbox" class="subscription-checkboxes" value="shelf" /><br>
Store<input type="checkbox" class="subscription-checkboxes" value="store" /><br>
Claims<input type="checkbox" class="subscription-checkboxes" value="claim" /><br>
<div class="shelf" style="opacity:0.5;">
    A div with dates
</div>
<div class="shelf" style="opacity:0.5;">
    div 2
</div>

JavaScript

$(function () {
    
  $('.subscription-checkboxes').change(function () {                
     //get the value for selector
      var divs = $(this).val().toLowerCase();
      if ($(this).is(':checked')){
        $(divs).fadeTo('fast', 1.0);
        
    }
      else{
   $(divs).fadeTo('fast', .5);
      }
  });
});