deselect checkboxes and select the current one using jQuery

Question

I need a help/solution for this silly question as a lot of functionality written on these checkboxes so really sorry for that.

I have checkboxes ( minimum three ). User can select any checkbox but other checkboxes should be deselect and the condition to deselect other checkboxes by triggering force 'click' event on checkboxes not prop false.

Please let me know If above description is not clear enough.

( note: i can't use radio buttons for some reasons ).

again sorry for this stupid question, really appreciate your help.

 <div class=" tiles"> <div class=" savingPack"> <input type="checkbox" name="savingspack" value="savingspack6" data-add-price-month="0" data-add-price-onetime="1500" data-other-price-divs=".addons"> <div class="tile"> <div class="tile-label">op - 1</div> </div> </div> <div class=" savingPack"> <input type="checkbox" name="savingspack" value="savingspack6" data-add-price-month="0" data-add-price-onetime="1500" data-other-price-divs=".addons"> <div class="tile"> <div class="tile-label">op - 2</div> </div> </div> <div class=" savingPack"> <input type="checkbox" name="savingspack" value="savingspack6" data-add-price-month="0" data-add-price-onetime="1500" data-other-price-divs=".addons"> <div class="tile"> <div class="tile-label">op - 3</div> </div> </div> </div> 

 $('.savingPack').on('click touchstart', function(event) { var checkbox, allCheckboxes; allCheckboxes = $('.savingPack').find('.tile'); checkbox = $(this).find('.tile'); checkbox.toggleClass('active'); var other = allCheckboxes.not(checkbox); if (other.hasClass('active')) { other.triggerHandler('click'); other.removeClass('active'); } else console.log(false); event.preventDefault(); }); 

Answer 1

Try:

$('input[name="savingspack"]').on('click',function(){
   if(this.checked){
      $('.tiles input:checkbox').prop('checked',false);
      $(this).prop('checked',true);
   }
});