Changing specific text using jQuery.

Question

I have the following html code , and I want to search the Welcome and make it bold .

<div class="welcome-msg">Welcome, First Name | </div>

the Output should be like this using DOM manipulation.

<div class="welcome-msg"><strong>Welcome</strong>, First Name | </div>

thanks ..

Answer 1

var $welcomeMsg = $('.welcome.msg');
$welcomeMsg.html($welcomeMsg.text().replace(/(welcome)/i, '<strong>$1</strong>'));

Answer 2

You need simple replace there:

var txt = $('div.welcome-msg').text();
$('div.welcome-msg').text(txt.replace('Welcome', '<strong>Welcome</strong>'));

Answer 3

You could load the text as a variable but doing

var myvar=$('.welcome-msg').html();

to change the text

myvar=myvar.replace('Welcome', '<strong>Welcome</strong>');

then to put it back

$('.welcome-msg').html(myvar);

or in a single line

$('.welcome-msg').html($('.welcome-msg').html().replace('Welcome', '<strong>Welcome</strong>'));

Tested and work fine