如何使用切换来缩短我的代码？

Question

html是：

<div class="top-buffer myclass glyphicon glyphicon-grain"></div>

jQuery是：

$(".myclass").on("mouseover", function(){
    $(this).removeClass("glyphicon-grain").addClass("glyphicon-qrcode");
});
$(".myclass").on("mouseout", function(){
    $(this).removeClass("glyphicon-qrcode").addClass("glyphicon-grain");
});

以上工作正常。 我如何使用切换并缩短代码？

感谢。

Answer 1

{{1}}

Answer 2

尝试使用此代码段。

$("body").on("mouseover mouseout", 'div.myclass', function(){
    $(this).toggleClass("glyphicon-grain glyphicon-qrcode");
});

.glyphicon-grain
{
  color: green;
}
.glyphicon-qrcode
{
  color: blue;  
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="top-buffer myclass glyphicon glyphicon-grain">Div with toggle class</div>