Html 在加载类期间隐藏css:before元素

在我的woocommerce“添加到购物车”按钮上，我隐藏了文本，并使用以下css将其更改为图标

.single_add_to_cart_button:before {
font-family: eicons;
font-size: inherit;
font-weight: 700;
font-style: normal;
font-variant: normal;
line-height: 1;
text-rendering: auto;
-webkit-font-smoothing: antialiased;

内容：“\e8e7”

}

单击“添加到购物车”按钮时，它会被指定一个加载类，该类会显示一个动画cog并使按钮变暗。然而，我原来的图标仍然留在那里，仍然可见，而且它的齿顶看起来很奇怪

---

我想知道，是否可以在添加加载类时隐藏原始图标，然后在删除加载类时再次显示该图标？

如果正在将

加载

类添加到按钮本身，您可以执行以下操作：

.single_add_to_cart_button.loading:before {
    visibility: hidden;
}