div上的ajax调用问题

Question

I have multiple div with class "btn-custom btn-custom-primary". The AJAX call is not loading on .btn-custom click event but when I check on network section in console tab the data is returned through ajax success: function (data) but when i debug the code it throws "data is not defined" reference error and there is no error in console. Please help.

$(document).on('click', '.btn-custom', function() {
  var id = $(this).attr('id');
  var bid = $(this).attr('bid');
  $('.btn-custom').removeClass('btn-custom-selected').addClass("btn-custom-primary");
  $(this).removeClass("btn-custom-primary").addClass('btn-custom-selected');
  var HostelId = getParameterByName("id", window.location.href);

  $.ajax({
    url: 'index.php?secController=School&action=fetchActiveStatusOfRoom',
    type: 'POST',
    dataType: 'JSON',
    async: false,
    data: {
      id: HostelId,
      RoomId: id
    },
    success: function(data) {

    }
  });
});