How to display a specific word in bold using jquery?

Question

How to display a specific word in bold using jquery.

function OnSuccess(response) { var user = $('#username').val(); if (response.d == 1) { $('#result').text(user + ' already Exists'); $('#Button1').attr('disabled', true); } else { $('#result').text('Username '+user +' Ok'); $('#Button1').attr('disabled', false); } } 

Here I want the username (user) to be bold, the rest of the sentence should be normal. Is this possible with jquery?

Answer 1

Use html instead of text

 function OnSuccess(response) { var user = $('#username').val(); if (response.d == 1) { $('#result').html('<b>' + user + '</b> already Exists'); $('#Button1').attr('disabled', true); } else { $('#result').html('Username <b>' + user + '</b> Ok'); $('#Button1').attr('disabled', false); } } 

Answer 2

I prefer to use my own span tag to highlight the username.

 function OnSuccess(response) { var user = $('#username').val(); if (response.d == 1) { $('#result').html('<span id="user">' + user + '</span> already Exists'); $('#Button1').attr('disabled', true); } else { $('#result').html('Username <span id="user">'+user +'</span> Ok'); $('#Button1').attr('disabled', false); } $('#user').css('font-weight', 'bold'); } 

Answer 3

Try:

 $('#result').html('<strong>'+user+'</strong>' + ' already Exists');
$('#result').html('<strong>'+user+'</strong>' + ' already Exists'); 

Answer 4

This is possible by changing .text() to .html() and passing a valid html fragment, for example:

 $('#result').html('<strong>' + user + '</strong> already Exists'); 

Answer 5

You can use .css() to set the font-weight attribute to bold. Example: $('#mytext').css('font-weight', 'bold')

Answer 6

 function OnSuccess(response) { var user = $('#username').val(); if (response.d == 1) { $('#result').html('<strong>' + user + '</strong> already Exists'); $('#Button1').attr('disabled', true); } else { $('#result').html('Username <strong>'+user +'</strong> Ok'); $('#Button1').attr('disabled', false); } } 

it should do it.

Answer 7

 $('#resut').html("Hello " + "<span class='bold'>" + user +"</span>");