Used a lovely webfont recently via font-face, called Chanticleer Roman. Looks great for headings in a WordPress site. But unfortunately one of the post titles was “100% Beef” and Chanticleer has a pretty skimpy character set which doesn’t include the percent symbol.

jQuery to the rescue! Using this bit of code in my footer, I got jQuery to wrap all occurrences of the percent symbol in a span where I could specify the font as Times/serif.

<script type="text/javascript">
jQuery(document).ready(function($) {
		$("h1.entry-title a").each(function () {
			$(this).html($(this).html().replace('%','<span style="font-family:Times, serif;">&#37;</span>'));
		});
});
</script>

Worked a treat. If I have time I might go back and improve the code to look for an array of missing characters and swap the font used for those.