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 ..

may we know why you want to do that, there may be better ways e.g. if you have control over html why not put welcome in a span — Anurag Uniyal
– Anurag Uniyal, Commented Jun 21, 2010 at 8:29

reko_t · Accepted Answer · 2010-06-21 08:27:53Z

1

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

answered Jun 21, 2010 at 8:27

reko_t

56.6k10 gold badges92 silver badges77 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Sarfraz · Accepted Answer · 2010-06-21 08:28:40Z

0

You need simple replace there:

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

answered Jun 21, 2010 at 8:28

Sarfraz

384k81 gold badges561 silver badges613 bronze badges

Olly Hicks · Accepted Answer · 2010-06-21 08:35:32Z

0

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

answered Jun 21, 2010 at 8:29

Olly Hicks

1,0941 gold badge9 silver badges13 bronze badges