How to use child selectors in JSS

Have you tried doing:

const styles = {
  button: {
    '&:hover span': {
       color: 'blue',
    }
  },
  span: {
    color: 'red',
  }
}

As mentioned in the comment by @cwouter, if it was a class name, you can do something like this.

const styles = {
  button: {
    '&:hover $some_class_name': {
       color: 'blue',
    }
  },
  some_class_name: {
    color: 'red',
  }
}