I am trying to clear/stop setInterval from running, and have made changes to my approach based on other questions/answers I've found, but still can't get setInterval to stop running.

What I have here, is a Mutation Observer which detects a class change, and when that occurs, if two conditions are true (the presence of other classes), then some cursor tracking executes. All this works great.

When one of the two classes, .run-preview, is removed I then want to stop setInterval from running, as seen in the else if. I also have a commented line there where I was verifying that the else if is working, and it is.

I have a global variable intervalCursor = setInterval(move,1000/60);, and then am using that variable to later clearInterval(intervalCursor);.

const runPreview = document.querySelector('.projects');

new MutationObserver((mutations) => {
  if (mutations[0].attributeName === 'class') {
    console.log('Project list class changed');
 
    if ($('html').hasClass('no-touchevents') && ($('.projects').hasClass('run-preview'))) {
    
        var mouseX=window.innerWidth/2,
            mouseY=window.innerHeight/2;
        var intervalCursor = setInterval(move,1000/60);
            
        var projectPreview = {
         el:$('.image-container'),
         x:window.innerWidth/2, 
         y:window.innerHeight/2, 
         w:300,
         h:300, 
         update:function() {
           l = this.x-this.w/2; 
           t = this.y-this.h/2; 
           this.el.css({ 
            'transform':
            'translate3d('+l+'px,'+t+'px, 0)' });
            //console.log("transform");
           }
        }
        
        $(window).mousemove (function(e){
          mouseX = e.clientX;
          mouseY = e.clientY;
          //console.log("mousemove");
        })
        
        
        function move(){
          projectPreview.x = lerp (projectPreview.x, mouseX, 0.1);
          projectPreview.y = lerp (projectPreview.y, mouseY, 0.1);
          projectPreview.update() 
          console.log("move");
        }
        
        function lerp (start, end, amt){
          return (1-amt)*start+amt*end
        }

    } else if (!$('.projects').hasClass('run-preview')) {
        clearInterval(intervalCursor);
        return;
        //$('#content-container').addClass('test');
    }
 
  }
})

.observe(runPreview, { attributes: true });

Am I doing something wrong?