Hover element, show hover effect on parent elements siblings child

Question

Let's see now, not sure if I have the logic down 100%. This is what I'm working with (bootply demo here) ```

Architecture Hello world! Magazine 2007
Architecture Keep them coming Magazine 2007
Architecture The other posts Magazine 2007
Cities

Accepted Answer

I got your point what you are trying to do here, in this case, you can use the selector below.. so that when the `li` is hovered, it will also apply the color to the first `span`

```
.row:hover span:nth-of-type(1) {
   color: red;
}
```

I just inspected the DOM in your fiddle and I would like to alter some things in that..

Demo (`hover` an of the hello and see the very first `span` color will be changed)

Demo 2 (DOM Altered) - This is just a general idea, I've provided you the selector but this will need the DOM alteration anyways..

Altered Demo in your Code

Again as per your comment, now you can highlight all `span` along with their titles

```
ul li div.row:hover > span {
   color: red;
}
```

Final Demo

Hover element, show hover effect on parent elements siblings child

Solution

Problem