Uppercase First Letter of Text Using jQuery

In this tutorial, learn how to uppercase first letter of text using jquery. Make the first letter of all the words of a string to uppercase with jQuery. The short answer is: use replace() to replace the first letter from the capitals of them.

The string may be in lower case condition and you want to make the first letter to a capital. You can use jQuery replace function with toUpperCase(). However, you also require to get the text content using jQuery.

How to Uppercase First Letter of Text Using jQuery

To perform this task you need to get text content and store in a variable. Now apply to replace() to the variable you get after using text().

Test it Live


hello world to my string

The above example contains the text string and the button. Each text of the string is in a small letter. You have to make the first letter of each word to capitals. Click the above button to make the first letter of the text to capitals.

The jQuery replace function replaces the first small letters of each word with the capital letters.

Capitalize First Letter Using CSS

In addition to jQuery, you can also make uppercase using the CSS text-transform property. Pass ‘capitalize’ as the value of the text-transform property. Use the below given example to make transformation to uppercase.

Test it Live


this is another string

The above example showing the converted first letter of the text.

If you want to perform the transformation of the text on button click. You have to use the jQuery method to make the conversion.

You may also like to read

I hope, you like the tutorial of how to uppercase the first letter of text using jquery. If you have any query regarding the tutorial, please comment below.


Also tell me, which method you are using to make first letter uppercase with jQuery.

Leave a comment

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.