Help with wrapping character with CSS span using Jquery I have this jfiddle working (http://jsfiddle.net/FJxcG/), but the same code does not work on my Drupal 7 website. I added the JS file to my theme .info file, and the JS is showing up in the source; it's just not displaying the end result on-screen.

The reason I need this is so that I can wrap a span class around all instances of the Trademark special character (™). That character is too large in the font I am using, and I'd like to use that css/jquery function to apply the span so I can give the TM a smaller font size without affecting the rest of the text around it. Some of the TM's are within menu links, so I can't simply hard-code the new span class.

Thanks!
Two things I can think of that could possibly cause the problem:


Your code runs before the document is fully loaded. To fix it try wrapping the function call inside $(document).ready:

$(document).ready(function() {
  $('div').wrapInTag({
    words: ['™'],
    tag: '&lt;span class="trademark"&gt;'
  });
});

The CSS style are being overridden. Quickfix would be to add !important at the end.

.trademark {
  font-size: 9px !important;
  vertical-align: top !important;
}