'Changing style inside jQuery selector dynamically

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?



Solution 1:[1]

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" );

Solution 2:[2]

You should try this.

$('#div').html("data between "+ "YourText1" + "to" + "YourText2").css('text-align','center');
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
<div id="div"></div>

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 gurvinder372
Solution 2 Ankit Kathiriya