javascript - 当鼠标进入该字段时，div 不会改变颜色

Question

当鼠标进入 div 字段时，我无法更改 div 的背景颜色。我正在使用 javascript/jquery 来尝试此操作，但似乎没有发生任何事情。发布的是我尝试访问的 html、css 和 javascript 的链接。

谁能告诉我为什么这不起作用？？？我似乎无法弄清楚，这里的其他示例有 1000 个解决方案，当我尝试使用它们时，它们却不起作用。

//HTML

    <section class="box content">
     <div id="projects"></div>
    <div class="container">
      <h2>Title Three</h2>
      <p>content goes here</p>
      <div class="someContent">

        <p>more stuff change me
        </p>
      </div>
    </div>
  </section>

//CSS

.someContent {
width: 60%;
margin-left: 100px;
border: 2px solid black;
text-align: left;
}

.hightLight {
background-color: yellow;
border: 2px solid blue;
}

//JavaScript

(document).ready(function() {
$(".someContent").on("mouseenter", function() {
$(this).addClass("highLight");
}).on("mouseleave", function() {
$(this).removeClass("highLight");
});
});

//最后添加在我的 html 顶部的标签

<!-- css -->
<link rel="stylesheet" href="css/normalize.css">
<link rel="stylesheet" href="css/style.css">

<!-- js -->
<script src="js/jquery-1.9.1.min.js"></script>
<script src="js/scroll.js"></script>

为什么 div“.someContent”没有改变？ >-<

Answer 1

将 CSS 中的 .highLight 选择器重命名为 .highLight。并在第一行 JavaScript 前面添加 $:

$(document).ready(function() {