classList.add() implementando, não substituindo.

Estou fazendo o exercício da aula 7 do javascript, porem quando uso o classList.add(), ele implementa a classe, e não substitui a já existente. Exemplo

class = "paciente"

quando uso o classList.add("paciente-invalido"):

a classe vira "paciente paciente-invalido" e o código do CSS não funciona.

Já tenteni tambem remover a classe antes de colocar a outra, e continua não funcionando. Verificando o elemento pela inspeção, vejo que muda a classe, mas ainda sim o CSS não funciona.

pacienteARemover.classList.add("fadeOut");

css > 
.fadeOut{
    opacity: 0;
    transition: 0.5s;

}

--------------------------------

pacienteARemover.classList.remove("paciente");
         pacienteARemover.classList.add("fadeOut");