JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="css/style.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
 <script src="js/script.js"></script>

<div class="example">
      
       
    </div>

CSS

.edit-container {width:100px; height:100px; background:green;}
.example {background:blue; width:200px; height:200px;}

JavaScript

$('.edit-container input[type="checkbox"]').change(function() {
    var examplediv= document.getElementById("example")
    var container=$(this).parent('.edit-container').parent('.edit-container');
    
    if(container.find('#a1:checked,#a2:checked').length==2)
       
         examplediv.css('background','red');
    else
         examplediv.css('background','');    
})