Seleccionar elementos de caja y: después de

Question

¿Por qué no funciona? ¿Existe una solución para esto sin agregar un elemento adicional?

http://jsfiddle.net/86gb2/

Answer 1

En su violín la siguiente declaración probablemente no está haciendo lo que se espera.

select:after {content: "This doesn't work";} 

Esto realmente añadir el texto después del contenido del cuadro de selección, no después de que el propio cuadro de selección. Entonces ese texto se agrega después del último option en el marcado. (Que por supuesto no es ni válida, ni será dictada por el navegador.)

En otras palabras, si usted ha tenido este marcado:

<a href="#">My link</a> 

y esto CSS:

a:after {content: " has now been appended to";} 

Lo que está sucediendo realmente es la siguiente:

<a href="#">My link has now been appended to</a> 

Answer 2

recomendaría utilizar la API de jQuery para este tipo de cosas:

$(document).ready(function(){ 
    $("select").after("<div>this doesnt work, or does it?</div>"); 
});​