Select only the first children of a parent element

Question

Select only the first children of a parent element

Navigation

#1 by (1 votes)

1

I have the following marking:

     <div class="step-content">
        <div id="step-1">
            <h1>step 1</h1>
            <h1>step 1</h1>
        </div>
        <div id="step-2">
            <h1>step 2</h1>
            <h1>step 2</h1>
        </div>
        <div id="step-3">
            <h1>step 3</h1>
            <h1>step 3</h1>
        </div>
     </div>

In this example I need to select only the elements #step-1 , #step-2 and #step-3 to set display:none to each of them and not to their relative ( .step-content ).

Above I used div and id sequential, but the selector should not depend on the type of element ( div , section , p and etc) and neither its id or class

Which selector should I use to select all the first nodes that are children of .step-content independent of the HTML element?

css seletores

asked by anonymous 05.08.2015 / 17:52

1 answer

How to simulate a cast of a class in PHP (other than stdClass)? Execute jQuery to select Applicant

score 1 · Accepted Answer

If you want to use only css , the trick is to use > :

.step-content > * {
    display: none;
}

If you want to work with jQuery:

For this you can use .children() . Example:

$('.step-content').children()

Return:

[<div id="step-1">…</div>, <div id="step-2">…</div>, <div id="step-3">…</div>]