Jquery 当滚动到特定部分时更改图像

我创建了一个粘性动画，代码是可以工作的，但有时它可以工作，有时它在Wordpress中显示错误，我不知道为什么我只想当用户滚动到某个部分时，根据滚动更改div图像，但我面临着未捕获类型错误的错误：无法读取未定义的属性“top”，并且在一些短时间内，这个警告消失了，代码再次运行，我只是想知道我的脚本是否正确

    jQuery(document).ready(function(){
    jQuery(window).scroll(function() {
    //get current sroll position
    var scrollPosition = jQuery(window).scrollTop();
    //get the position of the containers
       let one =jQuery("#one").offset().top;
       let two = jQuery("#two").offset().top;
       let three = jQuery("#three").offset().top;
    var ele = jQuery("#ele"); // this is the div the image is changed when user scroll
    //if the scroll position is the same as the position of the container specified, add the "active" class to the corresponding nav element
    if (scrollPosition >= one) { 
      ele.addClass("clock1");
    }
     else{
      ele.removeClass("clock2");
      ele.removeClass("clock3");
    }
    if (scrollPosition >= two) {
      ele.addClass("clock2");
    }
    else{
      ele.removeClass("clock3");
    }
    if (scrollPosition >= three) {
      ele.addClass("clock3");
    }
  });
});