Question: ```
jQuery('.parent:visible').each(function () {
  if (jQuery(this).find('.child-1').is(':hidden')) {
    jQuery(this).find('.child-2').css('color', '#000')
  }
});

```

Selecting the children are easy, separately, but since there are no `if` statements in CSS, I'm hoping there's some magic CSS I'm missing.

edit: fixing js as per suggestions

Answer: 
`.parent:not(.hidden) .child-1:not(.hidden) + .child-2` perhaps?

---

[***Demo***](http://jsfiddle.net/3dv7mzfd/)

```css
.parent { border:1px solid red; }
.hidden { display:none; }

.parent:not(.hidden) .child-1:not(.hidden) + .child-2 {
    color:green;
}

```

```html
<div class="parent">
    <div class="child-1">one</div>
    <div class="child-2">two</div>
</div>

<div class="parent">
    <div class="child-1 hidden">one</div>
    <div class="child-2">two</div>
</div>

<div class="parent hidden">
    <div class="child-1">one</div>
    <div class="child-2">two</div>
</div>

<div class="parent">
    <div class="child-1">one</div>
    <div class="child-2">two</div>
</div>

```
If you can add classes to the elements based on their visibility, then you can do this.

```
.parent.visible .child-1.not-visible + .child-2 {
    color: #000
}

```

This will check if a `.child-1` inside a `.parent.visible` has a class of `.not-visible` -- if it does, then the **[adjacent sibling](https://developer.mozilla.org/en-US/docs/Web/CSS/Adjacent_sibling_selectors)** with a class `.child-2` will inherit this rule.

Otherwise, you have to use JavaScript as CSS doesn't have a way to **test** if an element is visible or not.