uncheck Bootstrap checkbox buttons - Pure JavaScript
<p>I have a data filtration function in my app, where users can use checkboxes and dropdowns to select how they want to filter the data. </p>

<p>I am using the bootstrap checkboxes:</p>

<pre><code>&lt;div class="btn-group" data-toggle="buttons"&gt;
 &lt;label class="btn btn-primary active"&gt;
  &lt;input type="checkbox" autocomplete="off" checked&gt; Checkbox 1 (pre-checked)
 &lt;/label&gt;
 &lt;label class="btn btn-primary"&gt;
  &lt;input type="checkbox" autocomplete="off"&gt; Checkbox 2
 &lt;/label&gt;
 &lt;label class="btn btn-primary"&gt;
  &lt;input type="checkbox" autocomplete="off"&gt; Checkbox 3
 &lt;/label&gt;
&lt;/div&gt;
</code></pre>

<p>I have a <strong>clear filter</strong> buttons which clears all the users inputs from the filters, resets all checkboxes, all drop downs, all text fields.</p>

<p>I was able to reset drop downs like this:</p>

<pre><code>// sectorPicker is drop down
document.getElementById('sectorPicker').reset();
</code></pre>

<p>Below is the image of my checkboxes:</p>

<p><a href="https://i.stack.imgur.com/sAKak.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/sAKak.png" alt="enter image description here"></a></p>

<p>But I can't figure our how to reset the Bootstrap checkboxes on the screen to uncheck all checkboxes.</p>

<p>Any thoughts?</p>