Тег обрамить ссылкой

[maximus]

Помогите реализовать если это конечно же возможно.
На странице есть html код вида

<div class="menu">
<u>тег 1</u>
<u>тег 2</u>
<u>тег 3</u>
</div>

Нужно получить следующее

<div class="menu">
<a href="/cat/тег 1/"><u>тег 1</u></a>
<a href="/cat/тег 2/"><u>тег 2</u></a>
<a href="/cat/тег 3/"><u>тег 3</u></a>
</div>

Т.е. теги в меню становились ссылками и сам текст между <u>текс</u>
дописывался к ссылке /cat/текст/
Реально ли такое сделать?
вот что накодил, я нуб в js, не пинайте пожалуйста

$('.menu u').live('hover', function(){
    var id = $(this).attr('id');
    var link = '<a href="/cat/'+document.getElementById(id).innerHTML+'"></a>';
    $(this).wrap(link);

только при последующих hover на УЖЕ ссылку он еще раз делает ее ссылкой, как от этого избавиться?

[danik.js]

Это нужно делать на сервере. Какой у вас движок?

[maximus]

убираю ссылки от ПС, вот поэтому и нужно так сделать
мои кривые руки делают успехи )

$('.menu > u').live('hover', function(){
    var id = $(this).attr('id');
    var link = '<a href="/cat/'+document.getElementById(id).innerHTML+'"></a>';
    $(this).wrap(link);

});

скажите пожалуйста это во всех браузерах работать будет или нужно еще что то?

[T-sh]

<script>
$().ready(function() {
    $('.menu ul').each(function(){
       $(this).wrap("<a href=\"cat/"+$(this).html()+"/\"></a>");
    });
});
</script>

[T-sh]

вешать действия, копающиеся в ДОМе, на "ховэ" — плохая идея. Посетитель может перебирать ссылки с клавиатуры или тачскрина

[maximus]

спс понял, код работает прекрасно )