SASS :after :hover selector [duplicate]

Question

How do I use a SASS selector within a pseudo selector on a hover state? Wanting to write less code and clean this up.

Preferred method, not working:

div {
    a {
        transition: all 0.25s ease-in-out;
        &:after {
            content: ">>";
            left: 10px;
            :hover & {
                left: 10px;
            }
        }
    }
}

As opposed to:

div {
    a {
        transition: all 0.25s ease-in-out;
        &:after {
            content: ">>";
            left: 10px;
        }
        &:hover {
            &:after {
                left: 10px;
            }
        }
    }
}

Answer 1

Use &:hover:after {} for targeting the after pseudo-element of the element being hovered over.

&:after:hover {} would select the after pseudo-element and used on hover it.