FullCalendar view not showing on load

I am using FullCalendar for a new site I working on. I have two divs with calendars attached. The first loads as expected...no issues. The second is the problem. It loads the header with buttons and title, but the view div is empty. I checked for errors, and none were thrown. If I click on the any header button the view is displayed as expected. I thought maybe it was a conflict between the two calendars, and it doesn't seem to be the issue. See the code below, and let me know your thoughts. I am using a Parse backend, which seems to be working just fine, and jQuery. Events call the same function for loading events and it also is working properly. First calendar code: ``` $('#calendar').fullCalendar({ timezone: 'local', events: function( start, end, timezone, callback ) { callback(getEvents(events, start, end)); }, color: 'lightBlue', textColor: 'gray', eventMouseover: function( calEvent, jsEvent, view ) { var $target = $(jsEvent.target).css('cursor', 'pointer'); var location = userData.locations[calEvent.location.id]; var event = userData.events[calEvent.eventData.id]; var options = { items: $target.parent(), content: function() { var info = "Event: <b>" + calEvent.title + "</b><br/><center>" + calEvent.description + "</center><br/>Date: " + moment(calEvent.start).format("MM/DD/YYYY h:mma - ") + moment(calEvent.end).format("h:mma") + '<br/>Frequency: ' + event.get('eventFrequency') + '<br/> Frequency End Date: ' + moment(event.get('eventEndDate')).format('MM/DD/YY') + '<br/>Location: <center>' + location.get("locationName") + '<br/>' + location.get('locationAddress') + location.get('locationAddress2') + "<br>" + location.get('locationCity') + ', ' + location.get('locationState') + ' ' + location.get('locationCountry') + ' ' + location.get('locationPostalCode') + "</center><br/><center>Click Event to Edit"; return info; } }; $(view.el).tooltip(options); }, eventMouseout: function( calEvent, jsEvent, view ) { $(view.el).tooltip('destroy'); }, eventClick: function(calEvent, jsEvent, view) { console.log(calEvent); console.log(jsEvent); console.log(view); userData.currentLocation = {}; var location = userData.currentLocation['location'] = userData.locations[calEvent.location.id]; var query = new Parse.Query('Event'); query.equalTo('user', currentUser); query.equalTo('parent', location); query.find().then(function(events) { userData.currentLocation.events = events; addRow(calEvent.eventData); $('#add-location').text('Back to Calender').off().one('click',showCalendar); }, function(error) { errorMessage(error); }); }, header: { left: 'title', center: '', right: 'today prev,next' }, buttonIcons: { prev: 'left-single-arrow', next: 'right-single-arrow', }, dayClick: function(date, jsEvent, view) { } }); ``` Screenshot on load...works perfectly. Second calendar...not so much. Here's the code: ``` $('#kp-agenda-view').fullCalendar({ header: { left: 'prev,next today', center: 'title', right: 'month,agendaWeek,agendaDay' }, defaultDate: '05-05-2015', allDay: false, color: 'lightBlue', textColor: 'gray', timezone: 'local', overlap: false, editable: true, buttonIcons: { prev: 'left-single-arrow', next: 'right-single-arrow', }, events: function(start, end, timezone, callback) { callback(getEvents(userData.currentLocation.events, start, end)); }, }) ``` After clicking any header button (I clicked 'today')...the view is loaded Not really sure what's going on, and I can't seem to find any similar entries on the web. Thanks in advance, and let me know if more information is needed.