show div if sibling doesn't have a certain class-CodePudding

I have two divs, one with the class "d-none":

    <div >
      Ainda não existem documentos adicionados 
    </div>
     <div ></div>

What I'm trying to do is to hide the other with the "div.existentes" when it doesn't have ".d-none" anymore.

I've tried the selectors below:

existentes:not(.d-none)   .inexistente {
    display:none;
}

existentes:not(.d-none) ~ .inexistente {
    display:none;
}

But both didn't work. What am I doing wrong?

CodePudding user response：

There is no way to style an element according to "future elements". If you can change the HTML order of the two, everything works.

.existentes:not(.d-none) ~ .inexistente{
display:none
}

<div ></div>
<div >
      Ainda não existem documentos adicionados 
    </div>