Wrap span in wishlist link of header part in opencart

Question

I want to wrap a span on wishlist link of header part in my opencart theme.

I have tried the following attempts but not succeeded any one can suggest the better way?

THIS WORKS BUT ONLY WRAPS THE SPAN FOR A SECOND AND THEN AGAIN COMES TO IT DEFAULT STATE. A CLASS(whis) IS ADDED TO 'ADD TO WISHLIST' LINK

$(document).ready(function(e) {
    $('.whis').click(function(){
        $("#header .links #wishlist-total").wrapInner("<span></span>");     
    });
});

THIS WORKS UNTILL it is clicked on 'Add to wishlist' link of product.

$(document).ready(function(e) {
     $("#header .links #wishlist-total").wrapInner("<span></span>");            
});

Answer 1

Try with jQuery .live() function

$(function() {
    $(".whis").live("click", function(){
        $("#header .links #wishlist-total").wrapInner("<span/>");
    });
});