How to capture whether a checkbox has been checked or not?

I have a Bootstrap form modal being used for a webinar signup. I've removed the other fields, but I have multiple text fields that are being captured and pushed to a CMS.

It's just these 3 checkboxes that I can't seem to get to push data across correctly. The checkboxes are recording all as "on" if the form is submitted once, but if the form is submitted a second time then the checkboxes that are checked/not checked will push through "on" and "off" accordingly. So it works on the second submit, but not on the first. Any help would be greatly appreciated. I'm new to javascript and jquery, so i'm now at the point of guessing.

$(document).ready(function() {
  $('.register-webinar').click(function() {
    checked = $("input[type=checkbox]:checked").length;

    if (!checked) {
      alert("You must select at least one session.");
      return false;
    }
  });

  $('input.webinar').change(function() {
    if ($(this).is(":checked")) {
      $(this).val("on")
    } else {
      $(this).val("off")
    }
  });

  $('#railway_form').on("submit", function(e) {
    e.preventDefault();
    setTimeout(AoProcessForm(this), 200);
  });
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.0.0-alpha.6/css/bootstrap.min.css">

<div class="form-popup-bg">
  <div class="form-container">
    <button id="btnCloseForm" class="close-button">X</button>
    <h1 style="text-align:center;">Register your attendance</h1>
    <p style="text-align:center;">Please select which session/s you wish to attend.</p>
    <form name="railway_webinar" id="railway_form" class="railway_webinar" action="">
      <div class="form-group">
        <input type="checkbox" id="Webinar_1" name="Webinar_1" class="webinar">
        <label for="Webinar_1">webinar 1</label><br/>
        <input type="checkbox" id="Webinar_2" name="Webinar_2" class="webinar">
        <label for="Webinar_2">webinar 2</label><br/>
        <input type="checkbox" id="Webinar_3" name="Webinar_3" class="webinar">
        <label for="Webinar_3">webinar 3</label>
      </div>
      <input type="submit" value="Reserve my seat!" class="form-block-cta register-webinar" />
    </form>
  </div>
</div>