Скрыть псевдоэлемент при щелчке

Question

На моем сайте Wordpress у меня есть кнопка на главной странице, которая загружает больше сообщений. Я хотел добавить немного перевернутой каретки рядом со словами «загрузить больше сообщений», поэтому я добавил «v», используя псевдоэлементы. Я получил его, чтобы посмотреть, как я хочу, но когда я нажимаю кнопку, v не исчезает с остальной кнопкой? Я попытался установить его с :: активным классом, но он все еще появляется. Что мне нужно сделать, чтобы оно исчезло?

пример кнопки

после нажатия кнопки (я не хочу, чтобы v появляться)

текущий код CSS

.elm-button::before { 
 
    content: "v"; 
 
    font-size:11px; 
 
    float: right; 
 
    margin: 6px 0 0 14px; 
 
    font-family: 'Days One', sans-serif; 
 
} 
 
.elm-button::active { 
 
display: none; 
 
    visibility: hidden; 
 
}

Answer 1

В вашем фрагменте есть ошибка. :active - псевдокласс, а не псевдоэлемент, поэтому он имеет только один двоеточие.
Итак, как это.

.elm-button { 
 
    background:none; border:none; font:inherit; 
 
} 
 
.elm-button::before { 
 
    content: "v"; 
 
    font-size:11px; 
 
    float: right; 
 
    margin: 6px 0 0 14px; 
 
    font-family: 'Days One', sans-serif; 
 
} 
 
.elm-button:active { 
 
display: none; 
 
    visibility: hidden; 
 
}

<button class="elm-button" type="button">Load more posts</button>

(Кроме того, я полагаю, что вам нужно .elm-button:focus, как хорошо, но это не очень понятно из описания проблемы.)