JSFiddle - React, Tailwind, and code Playground

HTML

<div class='conteudo-oculto'> 
    <div>Conteudo da sua mensagem</div>
    <span style='display:none'>Mensagem oculta</span>
</div>

CSS

.conteudo-oculto span { display none; }
.blue { background-color: blue !important }
.conteudo-oculto { display: block; width: 200px; height:200px; background-color: red; padding:15px; border-radius:200px; line-height:200px; text-align:center; cursor:pointer }

JavaScript

$( function (){
    $(".conteudo-oculto").click( function(){
        $(".conteudo-oculto div, .conteudo-oculto span").toggle();
        
        if( !$(".conteudo-oculto").hasClass('blue') )
        $(".conteudo-oculto").addClass('blue');
        
        else
         $(".conteudo-oculto").removeClass('blue');
        
    });
});