Estoy tratando de usar jquery para deshabilitar las casillas de verificación después de seleccionar dos opciones en el menú de un restaurante. Las opciones se muestran en un modal. He intentado la mayoría, si no todas las recomendaciones para resolver sin suerte.

URL: https://206culinaryservices.com/place-an-order/

código base jQuery:

 $(":checkbox[name='rms_mod_666[]']").change(function() { if ($(":checkbox[name='rms_mod_666[]']:checked").length == 2) $(":checkbox:not(:checked)").prop('disabled', true); else $(":checkbox:not(:checked)").prop('disabled', false); });

parece funcionar bien en este jsfiddle: https://jsfiddle.net/R7Cwg/1/
pero no en mi caso de uso.

He intentado envolver en:

 (function( $ ) { $(function() { // insert above jquery code here }); });

esto resuelve el error pero el código aún no funciona como se desea.

...

Otro intento fallido:

 (function($) { $(function(){ var maxCheckboxes = 2; $('input[name="rms_mod_666[]"]').change(function () { var checkedNum = $('input[name="rms_mod_666[]"]:checked').length; var allCheckoxesChecked = $('input[name="rms_mod_666[]"]:checked'); var allCheckboxes = $("input[name='rms_mod_666[]']"); //alert(checkedNum + " - " + maxCheckboxes); if (checkedNum == maxCheckboxes) { $(allCheckboxes).attr('disabled', 'disabled'); $(allCheckoxesChecked).removeAttr('disabled'); // alert("ooou equals and disable!"); } else { $(allCheckboxes).removeAttr('disabled'); } }); }); })(jQuery);

Cualquier ayuda es muy apreciada.