Javascript 使用jquery更改css值

我试图用纯CSS实现这一点，使用

：focus

和

tabindex

方法与

进行交互，但当我试图通过HTML添加视频时，它破坏了这一切，因此我不得不求助于jQuery

我不熟悉JavaScript，但我正在尝试的是，当您单击

#about#me.tab时，它会这样做：在
元素之前，它会将
#about#me.tab
移动到0vh，并将其
z-index
更改为5，然后更改
框阴影
，但这不起作用。是否有人看到问题，或者是HTML还是CSS

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
  $("#about_me.tab:before").click(function(){
    $("#about_me.tab").css({"transition":"top 1s, z-index 0s","top":"0vh","z-index":"5","box-shadow":"0 0 8vw black"});
  });
});
</script>


$（文档）.ready（函数（）{
$（“#关于我。选项卡：之前”）。单击（函数（）{
$（“#about_me.tab”）.css（{“transition”：“top 1s，z-index 0s”，“top”：“0vh”，“z-index”：“5”，“box shadow”：“0 0 8vw black”}）；
});
});

Indy
jQuery

$("#about_me.tab").addClass('shadow');

CSS

.shadow{
//Your style

}

您应该使用jQuery选择器，而不是使用伪元素：

 $("#about_me.tab").prev().click(function(){
    $("#about_me.tab").css({"transition":"top 1s, z-index 0s","top":"0vh","z-index":"5","box-shadow":"0 0 8vw black"});
 });

或

什么“不起作用”？它正在启动click事件处理程序吗？如果不是，则第一个选择器是错误的，如果它正在启动-第二个选择器是错误的。您不能通过jQuery/JS选择伪元素，因为它们不在DOM中。您是否考虑过对答案做出某种反应？：）
 $("#about_me.tab").click(function(){
    $("#about_me.tab").prev().css({"transition":"top 1s, z-index 0s","top":"0vh","z-index":"5","box-shadow":"0 0 8vw black"});
 });