Zeichen färben

[Linuchs]

Moin,

in Liedtexten nutze ich das Zeichen | als Taktstrich.

Nun möchte ich alle | rot einfärben. Mit css funktioniert es so nicht:

  p[|] {
    color: #f00;
  }

Mit javascript leider so auch nicht:

document.getElementsByTagName( "body" )[0].innerHTML
 = document.getElementsByTagName( "body" )[0].innerHTML.replace(/|/g, "<b class=crot>|</b>");

Seltsamer Effekt: Dieser js-code fügt zwischen Zeichen den roten Taktstrich ein, wobei die HTML-Angaben zerstört werden:

Wie lasse ich die Taktstriche erröten? (zweideutiger Witz hat auch nicht geholfen 😉)