Is nesting necessary in some situations?

[dominikgorczyca]

For example, let's say we have button with an icon in it. When we hover the button I want the icon to change the color so I would need something like this:

.btn:hover .icon {
      // styles
}

If I just added the styles to the icon itself, hovering the button won't work but I guess you could add :hover to .icon and call it a day. There's a problem with it though, because I cannot focus on icon I indeed need to style the button:focus .icon to apply styles to the .icon. Is there a way to avoid this or is this one of the exceptions where you can use nesting? Do you use Javascript for such thing?