How to convert first letter of a string to upper case using jQuery ?
Last Updated :
13 Jul, 2023
The task is to capitalize the first letter of string without using toUpperCase() method with the help of jQuery. There are two approaches that are discussed below:
Approach 1: In this example, the css() method is used to set the text-transform property value to capitalize.
Example:
html
<!DOCTYPE HTML>
< html >
< head >
< title >
How to convert first letter of a
string to upper case using jQuery?
</ title >
< script src =
</ script >
</ head >
< body style = "text-align:center;" >
< h1 style = "color:green;" >
GeeksForGeeks
</ h1 >
< p >
Click on the button to
perform the operation.
</ p >
Type Here: < input id = "input" />
< br >< br >
< button onclick = "GFG_Fun()" >
Click Here
</ button >
< p id = "GFG" ></ p >
< script >
let geeks = document.getElementById('GFG');
function GFG_Fun() {
$('#input').css('textTransform', 'capitalize');
geeks.innerHTML = "Text is capitalized";
}
</ script >
</ body >
</ html >
|
Output:
Approach 2: In this example, we are using CSS property to perform the operation. A new ID has been added to the element which sets the property
text-transform to capitalize.
Example:
html
<!DOCTYPE HTML>
< html >
< head >
< title >
How to convert first letter of a
string to upper case using jQuery?
</ title >
< script src =
</ script >
< style >
#capital {
text-transform: capitalize;
}
</ style >
</ head >
< body style = "text-align:center;" >
< h1 style = "color:green;" >
GeeksForGeeks
</ h1 >
< p >
Click on the button to
perform the operation.
</ p >
Type Here: < input id = "input" />
< br >< br >
< button onclick = "GFG_Fun()" >
Click Here
</ button >
< p id = "GFG" ></ p >
< script >
let geeks = document.getElementById('GFG');
function GFG_Fun() {
$('#input').attr('id', 'capital');
geeks.innerHTML = "Text is capitalized";
}
</ script >
</ body >
</ html >
|
Output:
Like Article
Suggest improvement
Share your thoughts in the comments
Please Login to comment...