Find previous sister div in CSS

0

I have the following HTML:

<div class="load">
    <img src="images/load.svg" class="loadimg">
</div>

<div class="tela carregando">
    <span>Teste</span>
</div>

the following css:

.carregando {
    display: none;
}

.load {
    display: none;
}

.load > .carregando {
    display: block;
}

and JS:

$(".loadimg).click(function(){
    $('.tela').removeClass('carregando');
});

I want when removing class loading CSS changes style to something like:

.load > .carregando {
    display: block;
}

If the class carregando has active class load is display block ... in the last example CSS I tried using > but it did not work ...

It has to be in CSS in jQuery I know how to do ...

    
asked by anonymous 08.02.2017 / 23:47

1 answer

1

Try to style CSS like this:

$(".loading").click(function(){
    $('.tela').removeClass('carregando');
});
.carregando {
    display: none;
}

.load {
    display: none;
}

.carregando ~ .load {
    display: block;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><divclass="tela carregando">
    <span>Teste</span>
</div>

<div class="load">
    <img src="images/load.svg" class="loadimg">
</div>

<button class='loading'>TESTE</button>

As this is called Sibling I had to change the order of the elements.

    
09.02.2017 / 00:03