How do I check if an element is hidden in jQuery?

Using jQuery, you can detect if a specific element in the page is hidden or visible with is(:visible). You can try to run the following code to learn how to check if an element is hidden in jQuery or not −


Live Demo

      <title>jQuery Selector</title>
      <script src = ""></script>
         $(document).ready(function() {

           var visible = $('#myElement').is(':visible');
           if(visible) {
              alert("input element is visible");        
              alert("input element is hidden");
      <input type="text" id="myElement" style="display:block;"/>
      <button id="button1">Check Visibility</button>

Updated on: 12-Jun-2020


Kickstart Your Career

Get certified by completing the course

Get Started