JSFiddle - React, Tailwind, and code Playground

HTML

<input type="checkbox" id="testcase" />
<div id="activearea" for="testcase"></div>

CSS

#activearea{width:400px; height:200px; background-color:#efefef;}

JavaScript

$(function(){     
    
    // warum wird das change event nicht gefeuert bei div click?    
    $("#testcase").change(function(){
      
        $("#activearea").css("background-color", "#a1a4a6");
      
    });
    
    
    $("#activearea").click(function(){
        
        if($("#testcase").prop("checked")){
            
            $("#testcase").prop("checked", false);
            
        } else {
            
            $("#testcase").prop("checked", true);
            
        }
      
    });
    
  });