Check div/element/object is visible or hidden using Jquery

In this example i am going to explain about how to check a object is visible or not in the form.

Steps to follow:

1. :visible selector in jQuery Selects all elements that are visible. To get all visible divs inside a div with id "parentdiv" you can use below code. 

$('#parentdiv').find('div:visible').each(function () {

    // your code....

});

2. To check whether div with id "parentdiv" is visible use the below code.

if ($('#parentdiv').is(':visible')) {

    // your code....

}

3. To check whether div with id "parentdiv" is hidden use the below code.

if ($('#parentdiv').is(':hidden')) {

    // your code....

}

Important Note:

To achieve the best performance when using :visible or :hidden to select elements, first select the elements using a pure CSS selector, then use .filter(":visible") / .filter(":hidden") 

Example:

if ($('#parentdiv').is(':visible')) {

    // your code....

}

Other JQuery Articles you may like

1. Check div/element/object is visible or hidden using Jquery - New !!
2. Add remove select and set items in select drop down list
3. Bind unbind event in jQuery
4. Check uncheck all checkboxes in grid view using jquery
5. Get current url using JavaScript jQuery
6. How to get the keycode for different browser for keyboard characters
7. Move items in drop down list from left to right using jQuery

Do you like this article? Help us to improve. Please post your comments below.