利用jQuery实现绑定按钮变色写法

这个功能经常在视频网站用到，你点击一个集数之后，那个集数按钮就会变色，你点击其他的地方变色不会消失，需要点另一个集数，之前的变色才会消失。如下gif图：

代码演示（可直接运行）：

<button class="bsbtn">1</button>
<button class="bsbtn">2</button>	
<button class="bsbtn">3</button>	
<button class="bsbtn">4</button>	
<button class="bsbtn">5</button>		


<!--引入jq-->
<script src="https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
<!--绑定代码-->
<script>
$(document.body).on("click", "button", function () {
   $(".bsbtn").css("background-color","#ffffff");
   $(".bsbtn").css("color","#4c4a4a");
   $(this).css("background-color","#2fb3ff");
   $(this).css("color","#ffffff");
});
</script>
<!--设置一些样式-->
<style>
button{
    width:50px;
    height:50px;
}
.bsbtn:hover {
    border: 3px solid #2fb3ff;
}
</style>