apply styles by using classname in jQuery

In my previous posts, you learn how to apply CSS styles by using element id and element type. In this article I am explaining how to apply styles by using classname of an element.

 

<html>
    <head>
        <title>This is jquery example for applying styles using classname</title>
        <script type="text/javascript" src="jquery.js"></script>
        <script type="text/javascript">
            $(document).ready(function() {
                $('.pclass').addClass('italicbold');
            });   
        </script>
        <style type="text/css">
        .italicbold
        {
            font-style:italic;font-weight:bold;
        }
        </style>
    </head>
    <body>
        <p class="pclass">
            This is jquery example to make text as italic and bold by using class name
        </p>
    </body>
</html>

In the above code we have one <p> tag with class name as "pclass".

$('.pclass').addClass('italicbold') will apply the CSS class "italicbold" to the element whose classname is "pclass".

 

Download source code: styles using classname.zip (35.71 kb)

tags:

apply styles by using class name in jquery, styles through class name
Microsoft Visual Studio 2022 Promo Code
Latest News
Latest TechTips
Latest Posts
Categories