jquery - loop through text and replacing * with span -

i struggling script should replace text , make bold via css.

but problem is, script isn't looping. takes first text.

can me out?

here's my fiddle.

and here's code

$(document).ready(function (i) { $('.main:contains("*")').each(function () {     $(this).html($(this).html().replace('*', '<span class="highlight">'));     $(this).html($(this).html().replace('*', '</span>')); }); 

});

this 1 trick:

$(document).ready(function (i) {     function replace(o) {         $(o).html($(o).html().replace('*', '<span class="highlight">'));         $(o).html($(o).html().replace('*', '</span>'));         if ($(o).html().indexof("*") >= 0) {             replace(o);         }     }     replace('.main:contains("*")');  });