Javascript 向下滚动更改文本颜色不工作？

我的导航栏有一个名为LOGO ABCD的标题， 我尝试设置在向下滚动时通过添加和删除类来更改颜色， 但不知道为什么不工作

标志ABCD

A

B

C

D

---

---

---

---

我测试和“测试标题”已成功更改颜色

您可以运行下面的代码段并向下滚动，查看更改颜色。有什么问题吗

$（窗口）。滚动（函数（evt）{
如果（$（窗口）.scrollTop（）>0）
$（“.navbar”）.removeClass（“navbar顶部”）；
其他的
$（“.navbar”）.addClass（“navbar顶部”）；
});
$（窗口）。滚动（功能（evt）{
如果（$（窗口）.scrollTop（）>300）
$（.PJ_title”）.removeClass（“PJ_颜色”）；
其他的
$（.PJ_title”）.addClass（“PJ_颜色”）；
});
nav.navbar{
过渡：0.5s；
}
nav.navbar.navbar-default.navbar-fixed-top.navbar-top{
背景色：黑色；
}
nav.navbar.navbar-default.navbar-fixed-top.navbar-top a{
颜色：白色；
}
nav.navbar.navbar-default.navbar-fixed-top.navbar-top a:悬停{
颜色：黄色；
}
.PJ_标题{颜色：灰色；}
.PJ_颜色{颜色：红色；}
.PJ_标题{位置：固定；}

试验
考试题目
以下是您可以做到这一点的方法。在滚动功能中使用，
this.scrollY
。根据该值，根据需要添加或删除类


$（文档）.ready（函数（）{
$（窗口）。滚动（功能（evt）{
var scrollPos=this.scrollY；
如果（滚动位置>200）{
$（.navbar”）.removeClass（“navbar绿色”）；
$（“.navbar”）.addClass（“navbar蓝色”）；
}否则{
$（“.navbar”）.addClass（“navbar绿色”）；
$（.navbar”）.removeClass（“navbar蓝”）；
}
});
});
nav.navbar{
背景色：#ccc；
过渡：所有0.5s缓解；
}
导航条-固定顶{
位置：固定；
排名：0；
左：0；
宽度：100%；
}
.超长{
高度：200vw；
}
导航栏-绿色{
背景颜色：绿色；
}
导航条-蓝色{
背景颜色：蓝色
}

标志ABCD

A

这是一个经过清理的代码版本，可以正常工作。您必须根据需要更改颜色：


const w=$（窗口）；
常量头=$（“#主头”）；
w、 在（'scroll'，function（）{
如果（w.scrollTop（）>0）{
header.addClass（'header-secondary'）；
}否则{
header.removeClass（'header-secondary'）；
}
});
html{
身高：100%；
}
身体{
保证金：0；
字体系列：无衬线；
身高：100%；
}
标题{
宽度：100%；
显示器：flex；
位置：固定；
对齐项目：居中；
背景色：#ccc；
高度：50px；
过渡：背景色轻松。3s；
}
标题导航{
左边距：自动；
右侧填充：15px；
}
标题导航a{
文字装饰：无；
}
#标志{
字号：700；
左侧填充：15px；
}
.副标题{
背景色：深蓝色；
颜色：#fff；
}
.收割台辅助导航a{
颜色：#fff；
}
主要{
填充：65px 15px 0；
背景颜色：鲑鱼；
身高：200%；
}
主p{
保证金：0；
}

徽标ABCD
我的同僚们都是精英。自然之地的工作场所妨碍了工作人员在工作和劳动中获得最低限度的报酬。马格尼，奥迪。你认为你有尊严吗？法定实习律师。显然，这是一种不正当的行为

测试此代码：.PJ_color{color:red！重要；}以前尝试过，没有工作我找到了！我这样做的错误如下
徽标ABCD
但我不知道为什么，当我回到顶部时，颜色不会变回您的颜色
nav.navbar {
  transition: 0.5s;
}
nav.navbar.navbar-default.navbar-fixed-top.navbar-top {
  background-color: Black;
}
nav.navbar.navbar-default.navbar-fixed-top.navbar-top a {
  color         : white;
}

nav.navbar.navbar-default.navbar-fixed-top.navbar-top a:hover {
  color     : yellow;
}

$(window).scroll(function(evt){
  if ($(window).scrollTop()>0)
    $(".navbar").removeClass("navbar-top");
  else
    $(".navbar").addClass("navbar-top");
});

.PJ_title{color:grey;}
.PJ_color{color:red;}

$(window).scroll(function(evt){
  if ($(window).scrollTop()>300)
    $(".PJ_title").removeClass("PJ_color");
  else
    $(".PJ_title").addClass("PJ_color");
});