Javascript jQuery hasClass和if语句

我在尝试使此代码正常运行时遇到问题。 我有一个名为.collapsablemenu的div元素，当它激活时，我需要更改它的z索引。 单击菜单时，类“menu active”将通过一些其他js添加到主体中

这就是我所拥有的：

jQuery(document).ready(function($){
  if ($("body").hasClass('menu-active')) {
     $(".collapsible-menu").css("zIndex", 100);
  } else {
     $(".collapsible-menu").css("zIndex", 3);
  }
});

由于在加载文档后添加了类，这是否需要我使用变异观察？如果是这样，这条路对吗

var observer = new MutationObserver(function(mutations) {
      mutations.forEach(function(mutation) {
         if ($("body").hasClass('menu-active')) {
            $(".collapsible-menu").css("zIndex", 100);
         } else {
            $(".collapsible-menu").css("zIndex", 3);
         }
         console.log(mutation.type);
     });    
});

你应该使用CSS

.collapsible-menu{
   z-index: 3;
}
.menu-active .collapsible-menu{
   z-index: 100;
}

---

如果您可以使用CSS做一些事情，那么它几乎总是比使用JavaScript

更好的解决方案。问题或代码中的输入错误？天哪，我是个白痴，我立刻走了JS路线。再次感谢。