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

We utilize jQuery's is() method to check the selected element with another element, selector, or any jQuery object. This method traverses along the DOM elements to find a match, which fulfills the passed parameter. It will return true if there is a match, otherwise return false.

// Checks CSS content for display:[none|block], ignores visibility:[true|false]
$(element).is(":visible");

// The same works with hidden
$(element).is(":hidden");

You can use the hidden selector:

// Matches all elements that are hidden
$('element:hidden')
And the visible selector:

// Matches all elements that are visible
$('element:visible')

You can use use .is(":hidden") or .is(":visible").

Example:

<div id="div1" style="display:none">
  <div id="div2" style="display:block">Div2</div>
</div>

if ( $(element).css('display') == 'none' || $(element).css("visibility") == "hidden"){
    // 'element' is hidden
}