Skip to content
Related Articles
Open in App
Not now

Related Articles

How to change font size using jQuery ?

Improve Article
Save Article
Like Article
  • Last Updated : 30 Sep, 2021
Improve Article
Save Article
Like Article

In this article, we will see how to change the font size of an element using jQuery. To change the font size of an element, we will use css() method

The css() method is used to change the style property of the selected element.

Syntax:

$(selector).css(property)

Return value: It will return the value of the property for the selected element. 

In the below example, we have created a div element that contains some text and also created a button element. When the user clicks on the button, the css() method is called and this method sets the font-size property value to 32px.

Example:

HTML




<!DOCTYPE html>
<html lang="en">
  
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content=
        "width=device-width, initial-scale=1.0">
  
    <!-- Including jQuery -->
    <script src="
    </script>
</head>
  
<body>
    <center>
        <h1 style="color: green;">
            GeeksforGeeks
        </h1>
  
        <h3>
            How to change font size using jQuery?
        </h3>
  
        <div id="content">Welcome to GeeksforGeeks</div>
        <br>
  
        <button>Change font size</button>
    </center>
  
    <script>
        $(document).ready(function() {
            $('button').click(function() {
                $("#content").css("fontSize", "32px");
            });
        });
    </script>
</body>
  
</html>

Output: 


My Personal Notes arrow_drop_up
Like Article
Save Article
Related Articles

Start Your Coding Journey Now!