I'm trying to use the semantic UI checkbox in an MVC application, however, I've noticed that when using CheckBoxFor() it creates 2 inputs, one of which is hidden:

    

        
        
        Oil Starvation
    

Then I activate the checkbox like so:

$('.ui.checkbox').checkbox();

When I then click the checkbox, the "tick" animation doesn't show if the checkbox is ticked, although the value of true IS being set. Is there a way I can tell semantic UI checkbox method to target the non-hidden element?