Chiggins
Chiggins

Reputation: 8407

Select child element based on CSS

So what I would like to do is select a div inside slide_items that is not set to display: none, using jQuery. How could I do that?

<div id="slide_items">
  <div id="slide_item_1">
    <h2>Item 1</h2>
    <p>Text</p>
  </div>

  <div id="slide_item_2" style="display: none;">
    <h2>Item 2</h2>
    <p>Text</p>
  </div>

  <div id="slide_item_3" style="display: none;">
    <h2>Item 3</h2>
    <p>Text</p>
  </div>

  <div id="slide_item_4" style="display: none;">
    <h2>Item 4</h2>
    <p>Text</p>
  </div>
</div>

Upvotes: 0

Views: 282

Answers (4)

RPM1984
RPM1984

Reputation: 73133

$('#slide_items').find('div:visible');

Upvotes: 0

roto
roto

Reputation: 677

I believe this $("#slide_items div:visible") work.

Upvotes: 2

Yi Jiang
Yi Jiang

Reputation: 50165

You should be using the :visible pseudo-selector

$('#slide_items > div:visible')

Upvotes: 5

Phil
Phil

Reputation: 165069

$('#slide_items').find('div:visible')...

See http://api.jquery.com/visible-selector/

Upvotes: 1

Related Questions