I've been trying all day and reading a few things, but for some reason my code isn't working right

What i'm trying to achieve is this: When i create an un ordered list in my index page - I want my jquery to automatically add around the text in the anchor. So i want it to look like this

<li><a href="index.htm"><span>Home</span></a></li>

while I am only adding:

<li><a href="index.htm">Home</a></li>

I want to do this because i have a LOT of list items and instead of writing when i'm adding pages it makes the most sense to save some time in the long run and create a loop that will handle that anytime i add one.

This is What i have so far (sorry if it looks ugly):

$('document').ready(function () {
    var begSpan = "<span>";
    var endSpan = "</span>";
    $('p').each(function () {
        $(this) prepend(begSpan);
    }).append(endSpan);
});

How can i get that to auto create span tags for me