CODEWITHSUNDEEP
jquery
Peter
Peter

Reputation: 549

Jquery - Get all visible children from a div Get

I can get all the children of an element with this code

$('#all').children().each(function() { .... });

But how can i get all visible children with class "one" from id="all" ?

<div id="all">

    <div>asdd</div>
    <div class="one">content</div>
    <div class="one">bla</div>

    <div>
        ssss
        <div class="one" style="display:none">text</div>
    </div>

    <div class="one" style="display:none">blub</div>

</div>

Upvotes: 13

Views: 23243

Answers (4)

Brandon J. Boone
Brandon J. Boone

Reputation: 16472

Try this example

            $(document).ready(function(){
            
                $('#all').children().each(function() { 
                    if($(this).hasClass('one') && $(this).css('display') != 'none')
                    {
                        alert($(this).html());
                    }
                });
            });
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<html>
    <head>

    </head>
    <body>
        <div id="all">
    
            <div>asdd</div>
            <div class="one">content</div>
            <div class="one">bla</div>
    
            <div>
                ssss
                <div class="one" style="display:none">text</div>
            </div>
    
            <div class="one" style="display:none">blub</div>
    
        </div>
    </body>
    </html>

Upvotes: 0

kapser
kapser

Reputation: 619

You can use the following simple jQuery function

$('#all .one:visible');

This will get you all the visible elements with class one. (enclosed within the #all)

Upvotes: 5

Sarfraz
Sarfraz

Reputation: 382746

You can use the :visible filter selector like this:

$('#all').find('.one:visible').each(function(){
  // your code....
});

Upvotes: 20

Tahbaza
Tahbaza

Reputation: 9548

Would this work?

$('.one:visible', '#all')

Upvotes: 3

Related Questions