jQuery Check If Element Exists or Hidden

Last Updated on August 9, 2022 by Roshan Parihar

In this tutorial, learn how to check if element is exists or hidden using jQuery. The short answer is: use jQuery length with the selector of jQuery to find the hidden element on button click.

Find the hidden element’s existence and display the element with a button click. Initially, the element is in the hidden state using the CSS display:none property.

Let’s find out how to check the element if exists or not with the example given below.

How to Check If Element Exists Using

To perform this task, you have to first use the jQuery selector to select the required element. After that, use the length to find the length of the element that indicated the element exists. Now, use the show() function of jQuery to show the element when exist.

Test it Live

Output


The above example contains the button that you have to click the find the existence of an element. After you click the button, you will get the hidden element display using show(). The above example contains the <div> element and the paragraph element which is initially in a hidden state.

You May Also Like to Read

I hope you like this tutorial on how to check if the element exists or not using jQuery.