Wrapping text with a span in an unordered lists
So I'm still very new to jQuery (trying to learn this as fast as I can) and I've gotten stuck trying to figure out how to accomplish a certain thing.
I've got an unordered lists. I need to make the numbers larger (ordered lists numbers) and keep the text in the list at the same size. So what I was assuming I need to do is make the <li> font-size larger (the size I want the unordered list number to be), then wrap the text with a <span> and make the <span> smaller. I'm using a CMS and since the client will be modifying the text in the CMS, I can't exactly tell them to put <span> text, blah, blah</span> in the unordered lists as they won't figure that out. So how would I write the jQuery to wrap the text in the unordered lists with a span? Currently the output is like so:
-
<ol>
<li>Item One</li>
<li>Item Two</li>
</ol>
Which obviously outputs:
1. Item One
2. Item Two
But how do I get that html to be:
-
<ol>
<li><span>Item One</span></li>
<li><span>Item Two</span></li>
</ol>
Thank you in advance for any help![/code]