Trying to remove and add class to single event element breaks scrolling and rainbow color function

Question

The offending code block

function changeEventDetails(event) {
var src = 'https://www.google.com/maps/search/?api=1'
var locationURI = encodeURI(event.location)
// window.history.state.eventOpen = true
// var currState = window.history.state
// window.history.pushState(currState, null, "")
$('.calEvent .rainbow').text(event.title)
$('#eventID').text(event._id)
$("#startTime").html(moment(event.start).format('MMM Do h:mm A'));
$("#endTime").html(moment(event.end).format('MMM Do h:mm A'));
if (event.location == null) {
  $('#location').html("N/A")
} else {
  $('#location').html(event.location)
}
if (event.description == null) {
  $("#eventInfo").html("N/A")
} else {
  $("#eventInfo").html(event.description);
}

$("#eventLink").attr('href', event.url);
// $('#mapContainer').html('<iframe \
//       frameborder = "0" \
//       style = "border:0" \
//       src = ' + src + '&query=' + locationURI + ' \
//       allowfullscreen> \
//       </iframe>')
$('#viewMapLink').attr('href', src + '&query=' + locationURI)
// $('.fc-content:contains('+event.title+')')[0].scrollIntoView(true, {
//   behavior: 'smooth',
//   block: 'start'
// })

TweenMax.to($('#Calendar'), .5, {
  scrollTo: {
    y: $('.fc-content:contains(' + event.title + ')')[0],
    // offsetY: 50
  }
})

if($('.rainbow2').length >= 1 ){
  $('.rainbow2').removeClass()
  $('.fc-content:contains('+event.title+')').addClass('rainbow2')
} else {
  $('.fc-content:contains('+event.title+')').addClass('rainbow2')
}
console.log(event.title)

}

The block in particular which is breaking is if('.rainbow2') part. When its removed everything works fine. When it is added the ScrollTo function from gsap breaks and the rainbow background upon the selected element disappears completely.

https://github.com/maxcr/testytest

I hosted a github repo but you're going to need dugway to run it

https://github.com/bigcartel/dugway

once installed create fresh dugway project. cd into dir and clone my project to overwrite any files with the same name. Then dugway server and in another terminal cd into source and npm run watchProd

Answer 1

$('.rainbow2').removeClass() will remove all classes from the selected elements. To just remove the rainbow2 class you need

$('.rainbow2').removeClass('rainbow2')