selector css para el personaje

Tengo un lapso con un texto:

a sample text 

¿Es posible crear un selector que cambie el color de cada símbolo ‘a’ o ”

 .magic... { color: red; } 

Nota: no quiero rodear a todos los personajes con un intervalo adicional. Sé que esto funcionará

No hay forma de hacer esto solo con CSS, ya que no proporciona ningún selector para esto. Afortunadamente puedes usar javascript y regex en su lugar.

Aquí hay un ejemplo de código jquery que reemplazará cada carácter “a” que está dentro de un elemento p con a para que pueda tener un estilo diferente (encontré este código en algún lugar aquí, en stackoverflow, y lo adaptamos a tus necesidades):

 $('p').html($('p').html().replace(/a/g, 'a')); 

Demo actualizada

No es posible con CSS, en realidad he estado buscando algo muy similar. Esto es lo que encontré hace poco: (complemento jQuery)

http://bartaz.github.io/sandbox.js/jquery.highlight.html

Puede comenzar con ciertos caracteres resaltados al cargar la página … La documentación provista no es tan difícil de seguir si tiene alguna experiencia.