jQuery :reset Selector

Last Updated : 18 Nov, 2022

The jQuery :reset Selector is used to select the input element having a reset field button.i.e <input type="button">.

Syntax:

$(":reset")

Example 1: In this example, we will select the input element which has a reset field button by using jQuery :reset Selector.

HTML

<!DOCTYPE html>
<html>

<head>
    <script src=
"https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js">
    </script>

    <script>
        $(document).ready(function () {
            $(":reset").css("background-color",
                "coral");
        }); 
    </script>
</head>

<body>
    <center>
        <h1 style="color:green;">
            GeeksForGeeks
        </h1>
        <h2>jQuery :reset Selector
        </h2>
        <form action="#">
            Name:
            <input type="text" name="user">
            <br> Password:
            <input type="password" name="password">
            <br><br>
            <input type="reset" value="Reset">
            <input type="submit" value="Submit">
            <br>
        </form>
    </center>
</body>

</html>

Output:

Example 2: In this example, we will add a border to the input element which has a reset field button with click function.

HTML

<!DOCTYPE html>
<html>
  
<head>
    <script src=
"https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js">
    </script>
  
    <script>
        $(document).ready(function () {
            $("button").click(function () {
                $(":reset").css("border",
                                "2px solid red");
            });
        });
    </script>
</head>
  
<body>
    <center>
        <h1 style="color:green;">
            GeeksForGeeks
        </h1>
        <h2>jQuery :reset Selector</h2>
        <form action="#">
            Name:
            <input style="background-color: lightblue" 
                type="text" name="user">
            <br> 
          
              Password:
            <input style="background-color: lightblue" 
                type="password" name="password">
            <br><br>
          
            <input type="reset" value="Reset">
            <input type="submit" value="Submit">
            <br><br>
          
            <button type="submit" value="submit">
                Add Border
            </button>
        </form>
    </center>
</body>
  
</html>

Output:

jQuery :button Selector

manaschhabra2

Improve

Article Tags :

jQuery :reset Selector

Similar Reads

Thank You!

What kind of Experience do you want to share?