Golang React JS Technology Blog

jQuery check if an element is visible or hidden

Use Visibility Filter Selector 
<script>
   $(document).ready(function() {
       var isVisible = $('#visibleElement').is(':visible'); // True
       var isHidden = $('#hiddenElement').is(':hidden'); // True
   });
</script>
Complete Example 
<!DOCTYPE html>
<html lang="en">

<head>
    <style>
        #hiddenElement {
            display: none;
        }
        
        #visibleElement {
            display: block;
        }
    </style>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.js"></script>
    <script>
        $(document).ready(function() {
            var isVisible = $('#visibleElement').is(':visible'); // True
            var isHidden = $('#hiddenElement').is(':hidden'); // True
        });
    </script>
</head>

<body>
    <div id="hiddenElement">
        Test
    </div>
    <div id="visibleElement">
        Test
    </div>
</body>

</html>
Most Helpful This Week
Check if a string ends with the given target string How to declare and print value of variable in JavaScript? Highlight and get the details of table row on click using JavaScript What's the difference between let and var? How to change text after click event using JavaScript? JavaScript check if first string contains all characters of second string