У меня есть флажок, который необходимо преобразовать в тумблер
Ниже приведен HTML-флажок
https://jsfiddle.net/kdej9w2y/2/
<div class="checkbox">
<label>
<input data-val="true" data-val-required="The Value field is required." id="wffm302ebacf2b634d59b0dc1e81e451bc8d_Sections_0__Fields_7__Value" name="wffm302ebacf2b634d59b0dc1e81e451bc8d.Sections[0].Fields[7].Value" type="checkbox" value="true" autocomplete="off" style="display: none;">
<span class="button-checkbox bootstrap-checkbox">
<button type="button" class="btn clearfix custom-btn">
<span class="icon fa fa-check theme-text" style="display:none;"></span><span class="icon fa fa-check-square">
</span>
<span class="icon cb-icon-check-indeterminate" style="display:none;"></span>
</button>
</span>
<input name="wffm302ebacf2b634d59b0dc1e81e451bc8d.Sections[0].Fields[7].Value" type="hidden" value="false">
Flag
</label>
</div>
Я пытался применить разныено он ничего не делает.HTML всегда такой у меня в scnerio, так что есть ли способ реализовать тумблер на текущем флажке HTML.