Jackson Sentzke Jackson Sentzke - 9 months ago 121
CSS Question

JQuery: if div is visible

I'm using JS as a way of changing the content of a SPA I'm creating. When I press a button to change the content the html changes from this:

<div id="selectDiv" style="display: none;">

to this:

<div id="selectDiv" style>

Now part of my SPA has a div that contains a number of checkboxes, each representing a div, and so when I press the submit button, the next div that should be displayed will be the first item in the checkbox list that was selected.

I'm wondering if there's a way in JQuery for the code to "almost detect" which div is now visible. something like this:

//JS code associated with this div.

Any suggestions?

Answer Source

You can use .is(':visible')

Selects all elements that are visible.

For example:


Also, you can get the div which is visible by:


Live example:

#selectDiv {
  display: none;  
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="selectDiv"></div>
<div id="visibleDiv"></div>