Wrapping part of a string

Question

I’m testing a function to select the part of a title that comes after the two-point sign:

$('.carousel .item .carousel-caption h2').each(function(){
        var val = $(this).text();
        console.log(val);
        var string = val.substr(val.indexOf(":") + 1);
        console.log(string);

        var foo = val.replace('/('+string+')/g', '<span>$1</span>');
        console.log(foo);
    });

I can select the part I need, but I can’t include the tags. In the console, the foo variable appears equal to the val variable.

Answer 1

You cannot concatenate a string into a literal regular expression as you are trying (in fact, you ended up using a string instead of the literal regex). Use the builder RegExp:

var foo = val.replace(new RegExp('('+ string + ')', 'g'), "<span>$1</span>");

Then, don’t forget to replace the value of the element (I suppose the intention is this):

$(this).html(foo);

Answer 2

Or the uncomplicated way:

$('.carousel .item .carousel-caption h2').each(function(){
        $(this).html( $(this).html().replace(':', ':<span>') + '</span>' );
    });

Or with verification of the existence of ':':

$('.carousel .item .carousel-caption h2').each(function(){
        $(this).html( $(this).html().replace(':', ':<span>') + ($(this).html().indexOf(':') > 0 ? '</span>' : '') );
    });

Answer 3

Solved:

   $('.carousel .item .carousel-caption h2').each(function(){
        var val = $(this).text();
        var string = val.substr(val.indexOf(":") + 1);
        var re = new RegExp(string, "g");
        var novo = val.replace(re, '<span>'+string+'</span>');
        $(this).html(novo);
    });