JSFiddle - React, Tailwind, and code Playground

by robaldred

HTML

<div class="hiddendiv">
    <span>Someone turn on the lights, I'm hidden</span>
</div>

<div class="visiblediv">
    <span>I'm here, hello I'm visible.</span>
</div>

<p class="res">
    <b>Result:</b><br>
    
</p>

CSS

div {
    margin-bottom: 1rem;
}

.hiddendiv {
    visibility:hidden;
}

.visiblediv {
    visibility:visible;
}

JavaScript

if($('.hiddendiv span').is(':visible')) {
    $('.res').append('span in hidden div is visible, woot? No it\'s not<br>')
} else {
    $('.res').append('span is hidden div is hidden, great news<br>')
}

if($('.visiblediv span').is(':visible')) {
    $('.res').append('span in visible div is visible, no shit.<br>')
} else {
    $('.res').append('span in visible div is hidden, well i didn\'t expect that<br>')
}