How to underline a Hyperlink on Hover using jQuery?



To underline a hyperlink on hover using jQuery, use the jQuery css() property. The color text-decoration  property is used.

Example

You can try to run the following code to learn how to underline a hyperlink on hover:

Live Demo

<html>    <head>       <title>jQuery Hyperlink Decoration</title>       <script src = "https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>               <script>          $(document).ready(function() {             $('a').hover(                                function () {                   $(this).css({"text-decoration":"underline"});                });                          });       </script>       <style>       a {            text-decoration: none;          }      </style>    </head>        <body>       <a href="#">Demo text</a>            </body>     </html>
Updated on: 2019-12-11T08:17:41+05:30

643 Views

Kickstart Your Career

Get certified by completing the course

Get Started
Advertisements