I am working on one lightning component to create a calendar but I am getting the following error when I clicked on button.
"Uncaught Action failed: c:LightningCalender$controller$handleClick [$ is not defined]".
Can anyone help me out in this issue here.
My code is below Apex Class:
 

public class LightningCalender {
      @AuraEnabled
    public static list<Event> getAllEvents(){
      list<Event> eventlist =[Select id, EndDateTime,StartDateTime,Subject from Event ] ;
      return eventlist;
    }
    
    
    @AuraEnabled
    public static void updateEvent(string eventid,string eventdate){
    system.debug(eventid);
        system.debug(eventdate);
        string eventdatelist = eventdate.replace('T',' ');
       
  system.debug(eventdatelist);
    Event e= new event(id = eventid);
    e.StartDateTime = DateTime.valueof(eventdatelist);
    update e;
   
    }

}

Component.cmp:
 

<aura:component controller="LightningCalender" implements="force:appHostable,flexipage:availableForAllPageTypes,flexipage:availableForRecordHome,force:hasRecordId,forceCommunity:availableForAllPageTypes,force:lightningQuickAction" access="global">
	 <ltng:require styles="{!$Resource.Calender     + '/fullcalendar390/fullcalendar.css'}"
                  scripts="{!join(',',
                           $Resource.Calender  + '/fullcalendar390/lib/jquery.min.js',
                           $Resource.Calender  + '/fullcalendar390/lib/moment.min.js',
                           $Resource.Calender  + '/fullcalendar390/fullcalendar.js'
                           )}"
                  afterScriptsLoaded="{!c.afterScriptsLoaded}" />
    
    <ltng:require styles="/resource/calender/fullcalendar390/fullcalendar.css"/>
    
    <aura:attribute name='Objectlist' type='Object[]'/>
    <aura:attribute name="buttonstate" type="Boolean" default="false"/>
    
     <lightning:buttonStateful
        labelWhenOff="List View"
        labelWhenOn="Grid View"
        
        state="{!v.buttonstate}" onclick="{!c.handleClick }"/>
     
        <div id="calendar" class="slds-card">
      

    </div>
    <div id="listcalendar" class="slds-card"/>
</aura:component>

Controller.js:
 

({
	 afterScriptsLoaded: function(cmp,evt,helper){
         
         helper.fetchCalenderEvents(cmp);
        
    },
    
     handleClick : function(component, event, helper){ 
         var buttonstate = component.get("v.buttonstate");
         component.set("v.buttonstate",!buttonstate);
         if(!buttonstate){
          $("#listcalendar").show();
         $("#calendar").hide();
         $('#listcalendar').fullCalendar({
        	defaultView: 'listWeek',
             listDayFormat : true,
             events : component.get("v.Objectlist")
		});
         }
         else{
              $("#calendar").show();
           $("#listcalendar").hide();   
             helper.fetchCalenderEvents(component);
         }
        
    },

})

helper.js:
 

({
	loadDataToCalendar :function(component,data){  
        //Find Current date for default date
        var d = new Date();
        var month = d.getMonth()+1;
        var day = d.getDate();
        var currentDate = d.getFullYear() + '/' +
            (month<10 ? '0' : '') + month + '/' +
            (day<10 ? '0' : '') + day;
         
        var self = this;
        $('#calendar').fullCalendar({
            header: {
                left: 'prev,next today',
                center: 'title',
                right: 'month,basicWeek,basicDay'
            },
            selectable : true,
            defaultDate: currentDate,
            editable: true,
            eventLimit: true,
            events:data,
            dragScroll : true,
             droppable: true,
            weekNumbers : true,
  eventDrop: function(event, delta, revertFunc) {

    alert(event.title + " was dropped on " + event.start.format());

    if (!confirm("Are you sure about this change?")) {
      revertFunc();
    }
      else{
          var eventid = event.id;
          var eventdate = event.start.format();
          self.editEvent(component,eventid,eventdate);
      }

  },
            eventClick: function(event, jsEvent, view) {
           console.log(event.id);
              var editRecordEvent = $A.get("e.force:editRecord");
              editRecordEvent.setParams({
              "recordId": event.id
           });
           editRecordEvent.fire();
          },
            dayClick :function(date, jsEvent, view) {
              console.log(date.format());
                var datelist = date.format().toString().split('-');
             console.log(datelist[0]);
                console.log(parseInt(datelist[1])-1);
              var datetime = new Date(datelist[0],parseInt(datelist[1])-1,parseInt(datelist[2])+1,0,0,0,0);
            console.log(datetime);
             var createRecordEvent = $A.get("e.force:createRecord");
    createRecordEvent.setParams({
        "entityApiName": "Event",
        "defaultFieldValues": {
        'StartDateTime' :  datetime
        
    }
    });
    createRecordEvent.fire();
          },
            
            eventMouseover : function(event, jsEvent, view) {
            
          }
    });
    },
       
    
    formatFullCalendarData : function(component,events) {
        var josnDataArray = [];
        for(var i = 0;i < events.length;i++){
            var startdate = $A.localizationService.formatDate(events[i].StartDateTime);
            var enddate = $A.localizationService.formatDate(events[i].EndDateTime);
            josnDataArray.push({
                'title':events[i].Subject,
                'start':startdate,
                'end':enddate,
                'id':events[i].Id
            });
        }
      console.log('josnDataArray'+josnDataArray);
        return josnDataArray;
    },
     
    fetchCalenderEvents : function(component) {
         var action=component.get("c.getAllEvents");
       
         action.setCallback(this, function (response) {
            var state = response.getState();
            if (state === "SUCCESS") {
                var data= response.getReturnValue();
               console.log(JSON.stringify(data));
                 var josnArr = this.formatFullCalendarData(component,response.getReturnValue());
                this.loadDataToCalendar(component,josnArr);
                component.set("v.Objectlist",josnArr);
           
            } else if (state === "ERROR") {
                                 
            }
        });
        
        $A.enqueueAction(action);
       
    }, 
    
    editEvent : function(component,eventid,eventdate){
         var action=component.get("c.updateEvent");
console.log(eventdate);
         action.setParams({ eventid : eventid ,
                           eventdate : eventdate});

         action.setCallback(this, function (response) {
            var state = response.getState();
            if (state === "SUCCESS") {
            console.log('updated');
           
            } else if (state === "ERROR") {
                                 
            }
        });
        
        $A.enqueueAction(action);

    }
})