Change custom error message

Change custom error message

I have a form with two unrelated checkboxes and am trying to configure it so that it requires one checkbox to be checked. I accomplished that with the code below, but now need to change the error message so that it doesn't point to the first checkbox and read, "Please check this box if you want to proceed". I'm trying to figure out how to...

a. Change the invalid message to "Please select at least one option to proceed".
b. Possibly not have it point to the first checkbox.

Here's what I have so far:

  2. $( document ).ready(function() {
  3. $('#nurture_topic_insights').on('submit', submitFrm);

  5. var $checkbox = $('.custom-class')
  7. $checkbox.on('change', function(){
  8.   var checked = false;
  9.   
  10.   $checkbox.each(function(){
  11. checked = checked || $(this).is(':checked')
  12.   })
  13.   
  14.   $checkbox.prop('required', !checked)
  15.   $this.setCustomValidity('Please select at least one option to proceed')
  16.   
  17. })
  19. function submitFrm(e) {
  20.   e.preventDefault(); // Prevnts default form submit.
  21. }
  22. });