hover on parent and highlith all childs

hover on parent and highlith all childs

I have the following html:
<span id="spanus">
<a href="#">child1</a>
<a href="#">child2</a>
<a href="#">child3</a>
</span>
and css:
span{
background: gray;
border: 2px solid #eaeaea;
display: inline-block;
margin: 40px;
}
span:hover{
background: yellow;
border: 2px solid #fbfbfb;
}
a{
padding: 10px;
display: inline-block;
}
span a:hover{
color: #fff;
background: red;
}
fiddle:
My question is how can I have hover over all 3 a childs once of span when
I hover the span
thank you.