Is it possible to nest any DOM elements inside of an option element?

Question

I realize that nesting in an option element (aside from optgroup) is a violation of w3c standards. However, are there any elements which do not violate

Answer 1

No. Its content model is text.

http://www.w3.org/TR/html5/forms.html#the-option-element

Answer 2

By HTML syntax rules, you cannot nest any element inside option. (You can nest option inside optgroup, but that’s a different issue.)

Browsers enforce this: they discard any tags inside option. You can see this by testing with <option>foo <em>bar</em></option> and looking at the document e.g. with Firebug.

However, it is possible to insert DOM elements inside an option element with scripting, e.g.

<option id=foo>
...
<script>
  document.getElementById('foo').innerHTML = 'Hello <em>world</em>';
</script>

This is not particularly useful, since browsers impose severe restrictions on styling the content of option elements. Of the browsers I tested, only Firefox renders the em element in this context in its usual way for em (in italic) and lets me set e.g. its color and background in CSS.

And, of course, playing with the DOM in a manner that violates HTML rules is somewhat risky.