Checkbox option trick event
For example, Checkbox option trick event...
Demo
HTML
<div> <label>Que. 1 : Lorem Ipsum is...</label> <ul class="checkBoxList"> <li class="radio-button"> <input type="checkbox" name="ansOption" value="option-one" id="checkbox-one" data-uncheck="true" /> <label for="checkbox-one">Option One</label> </li> <li class="radio-button"> <input type="checkbox" name="ansOption" value="option-two" id="checkbox-two" data-uncheck="true" /> <label for="checkbox-two">Option Two</label> </li> <li class="radio-button"> <input type="checkbox" name="ansOption" value="option-three" id="checkbox-three" data-uncheck="true" /> <label for="checkbox-three">Option Three</label> </li> <li class="radio-button"> <input type="checkbox" name="ansOption" value="option-four" id="checkbox-four" data-uncheck="true"/> <label for="checkbox-four">Option Four</label> </li> <li class="radio-button"> <input type="checkbox" name="ansOption" value="option-none-of-the-above" id="none-of-the-above" data-action="noneabove" /> <label for="none-of-the-above">None of the above</label> </li> </ul> </div>
Javascript
$(function(){ $('[data-action="noneabove"]').click(function(){ if($(this).is(":checked")){ $(this).parents('.checkBoxList').find('[data-uncheck="true"]').prop('checked', false); } }) $('[data-uncheck="true"]').click(function(){ if($(this).is(":checked")){ $(this).parents('.checkBoxList').find('[data-action="noneabove"]').prop('checked', false); } }) })