I have the following code - example on jsFiddle
So the short answer on this seems to be that this is not possible. It is not possible to take a normal select with optionGroups and turn it into an accordion styled select list where initially, only the optiongroup items are displayed and clicking an optiongroup item expands its children (the options).
It seems that no browsers truly support clicking a group item in the select list. While there is an onClick event, the event acts more like you've clicked the selected item.