Проверка переключателя в многоэтапной форме

$(document).ready(function() {
  jQuery('#sucess').hide();
  var current_fs, next_fs, previous_fs; //fieldsets
  var left, opacity, scale; //fieldset properties which we will animate
  var animating; //flag to prevent quick multi-click glitches
  $(".next").click(function(event) {

    if (animating) return false;
    animating = true;

    current_fs = $(this).parent();
    next_fs = $(this).parent().next();

    //activate next step on progressbar using the index of next_fs
    $("#progressbar li").eq($("fieldset").index(next_fs)).addClass("active");

    //show the next fieldset
    next_fs.show();
    //hide the current fieldset with style
    current_fs.animate({
      opacity: 0
    }, {
      step: function(now, mx) {
        //as the opacity of current_fs reduces to 0 - stored in "now"
        //1. scale current_fs down to 80%
        scale = 1 - (1 - now) * 0.2;
        //2. bring next_fs from the right(50%)
        left = (now * 50) + "%";
        //3. increase opacity of next_fs to 1 as it moves in
        opacity = 1 - now;
        current_fs.css({
          'transform': 'scale(' + scale + ')'
        });
        next_fs.css({
          'left': left,
          'opacity': opacity
        });
      },
      duration: 800,
      complete: function() {
        current_fs.hide();
        animating = false;
      },
      //this comes from the custom easing plugin
      easing: 'easeInOutBack'
    });





  });

  $(".previous").click(function() {
    if (animating) return false;
    animating = true;

    current_fs = $(this).parent();
    previous_fs = $(this).parent().prev();

    //de-activate current step on progressbar
    $("#progressbar li").eq($("fieldset").index(current_fs)).removeClass("active");

    //show the previous fieldset
    previous_fs.show();
    //hide the current fieldset with style
    current_fs.animate({
      opacity: 0
    }, {
      step: function(now, mx) {
        //as the opacity of current_fs reduces to 0 - stored in "now"
        //1. scale previous_fs from 80% to 100%
        scale = 0.8 + (1 - now) * 0.2;
        //2. take current_fs to the right(50%) - from 0%
        left = ((1 - now) * 50) + "%";
        //3. increase opacity of previous_fs to 1 as it moves in
        opacity = 1 - now;
        current_fs.css({
          'left': left
        });
        previous_fs.css({
          'transform': 'scale(' + scale + ')',
          'opacity': opacity
        });
      },
      duration: 800,
      complete: function() {
        current_fs.hide();
        animating = false;
      },
      //this comes from the custom easing plugin
      easing: 'easeInOutBack'
    });
  });

  $("#msform").submit(function() {

    var location = jQuery('#location').val();
    if ($.trim(location).length == 0) {
      document.getElementById("location").style.borderColor = "#E34234";
      jQuery('.fs-error').html('<span style = "color:red;"> Please Enter Your Location !</span>');
      jQuery('.fs-error').show();
      return false;
    }

    var date = jQuery('#date').val();
    if ($.trim(date).length == 0) {
      document.getElementById("date").style.borderColor = "#E34234";
      jQuery('.fs-error').html('<span style = "color:red;"> Please Enter the Date !</span>');
      jQuery('.fs-error').show();
      return false;
    }

    var name = jQuery('#name').val();
    if ($.trim(name).length == 0) {
      document.getElementById("name").style.borderColor = "#E34234";
      jQuery('.fs-error').html('<span style = "color:red;"> Please Enter Your Name !</span>');
      jQuery('.fs-error').show();
      return false;
    }

    var email = jQuery('#email').val();
    if ($.trim(email).length == 0) {
      document.getElementById("email").style.borderColor = "#E34234";
      jQuery('.fs-error').html('<span style = "color:red;"> Please Enter Your Email !</span>');
      jQuery('.fs-error').show();
      return false;
    }

    var phone = jQuery('#phone').val();
    if ($.trim(phone).length == 0) {
      document.getElementById("phone").style.borderColor = "#E34234";
      jQuery('.fs-error').html('<span style = "color:red;"> Please Enter Your Phone Number !</span>');
      jQuery('.fs-error').show();
      return false;
    }

  });


});

<script src = "https://cdnjs.cloudflare.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
<form id = "msform" method = "POST" action = "abc.php">
  <!-- progressbar -->
  <ul id = "progressbar">
    <li class = "active"></li>
    <li></li>
    <li></li>
  </ul>
  <!-- fieldsets -->
  <fieldset>
    <div class = "row">
      <div class = "col-md-6 my-2">
        <div class='btns'>
          <label>
                              <input name = "artist" type='radio'>
                                <span class='btn first'>Singers</span>
                            </label>
        </div>
      </div>

      <div class = "col-md-6 my-2">
        <div class='btns'>
          <label>
                              <input name = "artist" type='radio'>
                                <span class='btn'>Bands</span>
                            </label>
        </div>
      </div>

      <div class = "col-md-6 my-2">
        <div class='btns'>
          <label>
                              <input name = "artist" type='radio'>
                                <span class='btn'>Rappers</span>
                            </label>
        </div>
      </div>

      <div class = "col-md-6 my-2">
        <div class='btns'>
          <label>
                              <input name = "artist" type='radio'>
                                <span class='btn'>Djs</span>
                            </label>
        </div>
      </div>

      <div class = "col-md-6 my-2">
        <div class='btns'>
          <label>
                              <input name = "artist" type='radio'>
                                <span class='btn'>Comedians</span>
                            </label>
        </div>
      </div>

      <div class = "col-md-6 my-2">
        <div class='btns'>
          <label>
                              <input name = "artist" type='radio'>
                                <span class='btn'>Motivational Speakers</span>
                            </label>
        </div>
      </div>

      <div class = "col-md-6 my-2">
        <div class='btns'>
          <label>
                              <input name = "artist" type='radio'>
                                <span class='btn'>Dancers</span>
                            </label>
        </div>
      </div>

      <div class = "col-md-6 my-2">
        <div class='btns'>
          <label>
                              <input name = "artist" type='radio'>
                                <span class='btn'>Actors</span>
                            </label>
        </div>
      </div>
    </div>
    <input type = "button" name = "next" class = "next action-button" value = "NEXT" />
  </fieldset>


  <fieldset>
    <h5 class = "concierge-mobile desktop-view">Celeb Concierge</h5>
    <h2 class = "artist-type">Type of Event</h2>
    <div class = "row">
      <div class = "col-md-6 my-2">
        <div class='btns'>
          <label>
                              <input name = "event" type='radio'>
                                <span class='btn first'>Wedding</span>
                            </label>
        </div>
      </div>

      <div class = "col-md-6 my-2">
        <div class='btns'>
          <label>
                              <input name = "event" type='radio'>
                                <span class='btn'>Private Party</span>
                            </label>
        </div>
      </div>

      <div class = "col-md-6 my-2">
        <div class='btns'>
          <label>
                              <input name = "event" type='radio'>
                                <span class='btn'>Brand Launch</span>
                            </label>
        </div>
      </div>

      <div class = "col-md-6 my-2">
        <div class='btns'>
          <label>
                              <input name = "event" type='radio'>
                                <span class='btn'>Corporate Get-Together</span>
                            </label>
        </div>
      </div>

      <div class = "col-md-6 my-2">
        <div class='btns'>
          <label>
                              <input name = "event" type='radio'>
                                <span class='btn'>Collegue Event</span>
                            </label>
        </div>
      </div>

      <div class = "col-md-6 my-2">
        <div class='btns'>
          <label>
                              <input name = "event" type='radio'>
                                <span class='btn'>Charity</span>
                            </label>
        </div>
      </div>

      <div class = "col-md-6 my-2">
        <div class='btns'>
          <label>
                              <input name = "event" type='radio'>
                                <span class='btn'>Photo/Video Shoot</span>
                            </label>
        </div>
      </div>

      <div class = "col-md-6 my-2">
        <div class='btns'>
          <label>
                              <input name = "event" type='radio'>
                                <span class='btn'>Concert</span>
                            </label>
        </div>
      </div>
    </div>
    <input type = "button" name = "previous" class = "previous action-button" value = "BACK" />
    <input type = "button" name = "next" class = "next action-button" value = "NEXT" />
  </fieldset>


  <fieldset>
    <h5 class = "concierge-mobile desktop-view">Celeb Concierge</h5>
    <h2 class = "artist-type">Type of Event</h2>
    <div class = "row">
      <div class = "col-md-12 my-2">
        <h6 class = "budget">Budget</h6>
        <div class = "rangeslider">
          <input class = "min" name = "range_1" type = "range" min = "1" max = "100" value = "10" />
          <input class = "max" name = "range_1" type = "range" min = "1" max = "100" value = "90" />
          <span class = "range_min light left">10.000</span>
          <span class = "range_max light right">90.000</span>
        </div>
      </div>
      <div class = "col-md-6 my-2">
        <input type = "text" name = "location" id = "location" class = "event-details" placeholder = "Event Location" />
      </div>
      <div class = "col-md-6 my-2">
        <input type = "text" name = "date" id = "date" class = "event-details" placeholder = "Event Date" />
      </div>
      <div class = "col-md-6 my-2">
        <input type = "text" name = "name" id = "name" class = "event-details" placeholder = "Name" />
      </div>
      <div class = "col-md-6 my-2">
        <input type = "text" name = "email" id = "email" class = "event-details" placeholder = "Email Id" />
      </div>
      <div class = "col-md-6 my-2">
        <input type = "text" name = "phone" id = "phone" class = "event-details" placeholder = "Phone Number" />
      </div>
    </div>
    <input type = "button" name = "previous" class = "previous action-button" value = "BACK" />
    <button class = "book-button" type = "submit">SUBMIT</button>
  </fieldset>

</form>