title: Clicking div to toggle checkbox and change css
body: <p>I've got a site built from many divs. Nearly all div's have the same class (for CSS) and different id. Here's a part of the code:</p>
  
  <pre><code>&lt;div class="box" id="testbox"&gt;
  &lt;img src=""&gt;&lt;br&gt;
  Name&lt;br&gt;&lt;input name="choice" value="1" id="name" type="checkbox" onchange="onCheckboxChanged(); checkTotal();"&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>When I click anywhere in this div I want to check/uncheck it's checkbox (which is hidden so it can't be clicked) and this will toggle onCheckboxChanged() (unlocks more checkboxes) and checkTotal() (adds values from checked checkboxes). Because of that. clicked div's must first check if a checkbox is enabled and then check/uncheck it. Also I want it to change the background of only this div. I would prefer a solution that uses only html/css/js.</p>