Applying CSS to a Visualforce apex:selectOption

I had a customer requirement to put some CSS formatted labels on some radio buttons in a Visualforce page. The markup was already using an <apex:selectOption> within a <apex:selectRadio>. I didn't want to revert to raw HTML controls as there was a <apex:actionSupport> already in use.

Using the style or styleClass to apply the CSS to the selectOption didn't work as they were deprecated in Salesforce API version 17.0.

Instead I created a property in the controller that returned the required HTML markup and set itemEscaped="false" on the selectOption.

E.g.:

Page:

    <apex:selectRadio layout="pageDirection" value="{!controllerflag}" rendered="{!(!addingNew)}">
        <apex:actionSupport action="{!getData}" status="addItem" event="onclick" rerender="somePageBlock">
            <apex:param name="selectedId" value="{!elementId}"/>
        </apex:actionSupport>
        <apex:selectOption itemLabel="{!radioSelectLabel}" itemEscaped="false" itemValue="true" >
        </apex:selectOption>
    </apex:selectRadio>

Controller:

    public string radioSelectLabel {
        get {
            if (hasBeenCancelled) {
                return '<span style="color:red;">(Cancelled)</span>';
            }
            return 'Available';
        }
    }