title: Can't Update Fabric Checkbox in UI via JS - JQuery
body: <p>I'm using Fabric UI Checkbox in my Office Add-In and I can't seem to programmatically check the checkbox in my taskpane. Actually, I can check it, but it doesn't show checked in the UI.</p>
  <p>I've been able to do it like so w/ radio-buttons and toggles, but can't get checkbox for the life of me.</p>
  <p>Radio:</p>
  <pre><code>$(&quot;#&quot; + YesRadioButtonId).siblings('label').addClass('is-checked');
  $(&quot;#&quot; + YesRadioButtonId).siblings('label').prop('aria-checked', true);
  $(&quot;#&quot; + YesRadioButtonId).prop('checked', true);
  </code></pre>
  <p>Toggle:</p>
  <pre><code>$(&quot;#&quot; + ToggleId).siblings('label').addClass('is-selected');
  $(&quot;#&quot; + ToggleId).prop('checked', true);
  </code></pre>
  <p>Checkbox HTML:</p>
  <p>Note: I can enable via HTML by adding either <code>checked=checked</code> or <code>aria-checked=true</code> but I want my HTML to be all disabled and only enable via JS.</p>
  <pre><code>&lt;div class=&quot;ms-CheckBox column-selector&quot;&gt;
      &lt;input tabindex=&quot;-1&quot; type=&quot;checkbox&quot; class=&quot;ms-CheckBox-input&quot; id=&quot;ChkBox-yes&quot; /&gt;
      &lt;label role=&quot;checkbox&quot;
             class=&quot;ms-CheckBox-field &quot;
             tabindex=&quot;0&quot;
             name=&quot;ChkBox-yes&quot;&gt;
          &lt;span class=&quot;ms-Label&quot;&gt;YES&lt;/span&gt;
      &lt;/label&gt;
  &lt;/div&gt;
  </code></pre>
  <p>Checkbox JS:</p>
  <p>Note: I tried adding jQueryui as I saw references online to <code>checkboxradio(&quot;refresh&quot;);</code> but I get error <code>cannot call methods on checkboxradio prior to initialization;</code></p>
  <pre><code>TaskPaneApp.CheckBoxElements = $(&quot;.column-selector&quot;).map(function () {
      return new fabric['CheckBox'](this);
  });
  //$(&quot;#&quot; + YesCheckBoxId).prop(&quot;checked&quot;, true).checkboxradio('refresh');
  $(&quot;#&quot; + YesCheckBoxId).prop(&quot;checked&quot;, true)
  $(&quot;input[type='checkbox']&quot;).checkboxradio();
  //$(&quot;#&quot; + YesCheckBoxId).attr('checked', 'checked');
  //$(&quot;#&quot; + YesCheckBoxId).$('input[checked=&quot;&quot;]').val(&quot;checked&quot;);
  //$(&quot;#&quot; + YesCheckBoxId).trigger(&quot;click&quot;); 
  //$(&quot;#&quot; + YesCheckBoxId).addClass(&quot;ui-checkbox-on&quot;);
  </code></pre>