用jQuery更新伪元素的CSS

Question

我发现了一些帖子，说明我无法使用jQuery操作伪元素，所以我正在寻找解决方法？

我希望在我们的网站搜索栏上运行Optimizely中的a / b拆分测试。 当前搜索栏的设计有css，它使用:: before Pseudo元素创建搜索图标，将字形图标作为按钮开始搜索。

根据我的测试，我想改变这个图标的颜色。 Optimizely允许您使用jQuery来定位元素并进行这些类型的更改。

目前的CSS如下：

.header .form-search button:before, .header .form-search .search- button:before {
content: "\f002";
font-family: "polar-icons";
color: #237cb2;
font-size: 1.8rem;
}

这是我试图实现的jQuery，但它没有工作：

$(".search-button::before").css({'color':'#E93826'});

任何帮助非常感谢。

Answer 1

尝试：

$('head').append('<style>.search-button::before{color:#E93826 !important}</style>');