Does anyone know how this can be done? AFAIK, Safari on a Mac is out of the question, because (based on my assumption) the JavaScript should (in theory) target the OS's rendering engine, and we all know Apple wont let you fiddle with that.

Anyhoo, this is the closest I've found to a solution:
changing the drop down arrow in Windows

However, as you can see, you can't seem to get a definite answer out of the whole thing (it's like finding a definition to a difficult word, only to find out the definition is full of difficult words as well. Typical Microsoft.)

The only other theory I can come up with is targeting the browsers specifically, similar to how you can edit IE's scroll bars (although that isn't so easily done in FF, I have a feeling it can still be done via JS, except I don't know how. ).

So... does anyone know how to directly edit the drop down arrow? How to replace it with an image? Or edit the colors? And still keep it XHTML 1.0 valid?