Write a jQuery code to make first word of each statement to bold

To make the first word of each statement bold using jQuery, you can loop through each element containing the statements and apply a CSS style to the first word. Here's an example of how you can achieve this:

<p class="statement">This is a paragraph.</p>
<p class="statement">This is a paragraph 2.</p>
   
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script>
    $(document).ready(function(){
    // Select all elements containing statements
     $('.statement').each(function(){
        // Split the text content into words
        var words = $(this).text().split(' ');
        // Get the first word
        var firstWord = words.shift();
        // Wrap the first word in a <span> element with a bold style
        $(this).html('<span style="font-weight: bold;">' + firstWord + '</span> ' + words.join(' '));
     });
    });
</script>

In this jQuery code, we first wait for the document to be ready. Then, we select all elements with the class statement using the jQuery selector.

We iterate over each of these elements using the each() function. Inside the loop, we split the text content of the element into an array of words using the split() function.

Then we shift the first word from the array and store it in a variable. Next, we wrap this first word in a <span> element with a bold style using the html() function. Finally, we concatenate the remaining words back together and update the content of the element.