Using pseudo-elements to change border to a different color

[asasass]

On this code
code: https://jsfiddle.net/q5cLpo06/

I have this code that uses pseudo-elements, but I can’t figure out how to do it on that one either.

code https://jsfiddle.net/yomgx53t/

I found this old code that does it.
code https://jsfiddle.net/06wkv52s/2/

That uses this:

.playButtonb.activated::before {
  opacity: 1;
  border: 3px solid red;
}

button.classList.add("activated");

But, how would I transfer that to the code I am trying to add it to?

[PaulOB]

If you want the blue border to change to red then you don’t need anything else in that demo as far as I can see. Just use the slide class that is already added on click.

e.g.

.curtain{transition:3s ease;}
.curtain.slide{border-color:red}

Assuming that’s the border you were talking about.