Customized CSS styles inside <option> tag in expanded <select> list

Question

I was wondering if there are other ways to customize an expanded select list using HTML or even a jQuery plugin. Basically I want each option in the list to be rendered with multiple styles, like in this example where the number is colored red:

<select size="12" name="ddlSpecial" id="ddlSpecial">
    <option value="1">
        <div>Option text <span style="color:Red;">(1)</span></div>
    </option>
    <option value="2">
        <div>Option text <span style="color:Red;">(1)</span></div>
    </option>
</select>

The HTML above works only in Firefox while the other browsers strip out the styling:

http://i.stack.imgur.com/TqZuc.jpg

Answer 1

Check this out:

http://www.jankoatwarpspeed.com/post/2009/07/28/reinventing-drop-down-with-css-jquery.aspx

you can do it, but you basically gonna have to replace the normal select with ul