javascript - 如何停止应用CSS文本阴影的jQuery悬停事件？

所以我有这个jQuery事件触发文本阴影：

$(".leftColumn").hover(function (){
  $(".leftColumn h2").css("text-shadow", "0px 2px 3px rgba(0, 0, 0, 0.5)");
},function(){});

问题在于，一旦将文本阴影应用于h2，即使我不再将鼠标悬停在leftColumn上，该文本阴影仍会保留。如何使文字阴影消失？

我试过了：

$(".leftColumn").hover(function (){
  $(".leftColumn h2").css("text-shadow", "0px 2px 3px rgba(0, 0, 0, 0.5)");
},function(){
  $(".leftColumn h2").css("text-shadow", "none");
});

但是，所有这些操作根本阻止了文本阴影的应用。

最佳答案

正如@Jaromanda X提到的那样，最好在CSS端进行处理。

.leftColumn:hover h2 {
  text-shadow: 0px 2px 3px rgba(0, 0,   0, 0.5);
}

<div class="leftColumn">
  <h2>I'm H1</h2>
</div>