Changing style inside jQuery selector dynamically

Question

I have a div and I am trying to display a text with bold font as follows:

$('#div').text("data between "+ fromdate + "to" + todate).css({'text-align':'centre'});

How do I display only "fromdate" and "todate" in bold font?

Answer 1

Use .html(), and wrap the text in <b> (if it is presentational) or <strong> tags:

$('#div')
    .html("data between <b>" + fromdate + "</b> to <b>" + todate + "</b>")
    .css("text-align", "center");

And centre should be center.

Answer 2

set as html then assign and filter as class, finally set the css to the filtered result

$('#div').html("data between <span class='bold'>"+ fromdate + "</span>to<span class='bold'>" + todate + "</span>").css({'text-align':'center'}).filter( ".bold" ).css( "font-weight", "bold" );