Is there any way to target siblings with `withStyles` in Material ui?

I am using the Select component of material ui. I want to customise the dropdown menu with a top arrow. I have overriden menuStyle using pseudo element before. However, the arrow appears on the screen even before clicking on the dropdown. This is because the class is used in select element as well. I want to target dropdown menu by checking for the siblings.

         <Select
              value={this.state.date}
              onChange={this.handleChange}
              displayEmpty
              name='date'
              autoWidth={false}
              className={classes.selectWithArrow}
              classes={{
                icon: classes.icon,
                selectMenu: classes.menuStyle,
                select: classes.select,
              }}
              renderValue={value => this.state.date}
              root={classes.root}
              input={
                <Input
                  name='date'
                  id="label-placeholder"
                  classes={{
                    root: classes.root,
                  }}
                />
              }
              MenuProps={{ classes: { paper: classes.menuStyle } }}
            >
              <MenuItem value={1}>One</MenuItem>
              <MenuItem value={2}>Two</MenuItem>
              <MenuItem value={3}>Three</MenuItem>
         </Select>

I want to target siblings something like this -

  const styles = theme => ({

   '.menuStyle.selectMenu': {

    '&::before': {

      },
    }
  });

Is there any way? Any leads will be highly appreciated.