Sonderzeichen via CSS automatisch anderer Farbe zuweisen

[Taschmahal]

Guten Tag.

Also ich bin nun endgültig verwirrt. Ich habe ja nun das übernommen:

function the_content($more_link_text = '(more...)', $stripteaser = 0, $more_file = '') {
 $content = get_the_content($more_link_text, $stripteaser, $more_file);
 $content = apply_filters('the_content', $content);
 $content = str_replace(']]>', ']]>', $content);
 $content = preg_replace('#([^\w\s]{1,})#is', '<span class="sonderzeichen">$1</span>',$content);
 echo $content;
}

nun wollte ich in der style.css eine neue classe machen. aber es ändert sich an der seite überhaupt nichts. weder werden die sonderzeichen farbig, noch werden die bilder wieder zu bildern bzw. die <> tags wieder zu dem, was sie eigentlich sind.

Nun habe ich ja eine nicht statische Website bzw. Inhalt. Also muss ich die Replace-methode anwenden. Doch brauche ich dann überhaupt das css und den oben genannten code? und wo muss dieser javascript befehl hin? Und wie würde er lauten?

Wie sie sehen, bin ich komplett verwirrt.