How to target the first child of a parent within a container if it is not directly a child-CodePudding

I want to be able to target the first child which is within a container. If the "wrapper" div was not there, this works fine. See the code below.

<div class="h">
  <div class="wrapper">wrapper</div>
  **<div class="in-convo">I want to select this div ONLY</div>**
    <div class="in-convo">2</div>
    <div class="in-convo">3</div>
</div>

CodePudding user response：

you can use nth-child(). It takes an integer which as you can guess is the nth child of an element.

for this case you could use

    .h:nth-Child(1){
    color:red
}

or if the wrapper is still there:

 .h:nth-Child(2){
        color:red
    }