javascript - 简单功能在Chrome 57.0.2977.98(64位)中不起作用

我有一个非常简单的功能，可以在Safari和Firefox中完美运行，但不能在Chrome中运行。

任何帮助将不胜感激。也许可以通过其他方式编写相同的函数？

$(document).on("mouseenter", "#menumore", function() {
    $("#menumore span").addClass("black")
})

$(document).on("mouseleave", "#menumore", function() {
    $("#menumore span").removeClass("black")
})

#menumore{font-family:Arial; font-size:60px;corsor:pointer;}
.white{opacity:0;transition:opacity .2s cubic-bezier(0.77,0,0.175,1)}
.black{opacity:1}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id=menumore>M<span class=white>ENU</span></div>

最佳答案

如建议的那样，您应该尝试使用CSS。

#menumore {
  font-family: Arial;
  font-size: 60px;
  corsor: pointer;
}

.white {
  opacity: 0;
  transition: opacity .2s cubic-bezier(0.77, 0, 0.175, 1)
}

#menumore:hover .white {
  opacity: 1
}

<div id=menumore>M<span class=white>ENU</span></div>