jQuery blur() Method (original) (raw)

Last Updated : 11 Jul, 2025

jQuery **blur() is an inbuilt method that is used to remove focus from the selected element. This method starts the blur event or it can be attached a function to run when a blur event occurs.

**Syntax:

$(selector).blur(function)

**Parameters:

It accepts an optional parameter "function".

**jQuery examples to show the working of blur() function:

**Example 1: In the below code, no function is passed to the blur method.

HTML `

<script>
    $(document).ready(function () {
        $("#btn").click(function () {
            $("input").blur();
            $("p").html(
                "This is blur method that is used!!!");
        });
    });
</script>

Enter Value:

<button id="btn">
    start blur event!!!
</button>
<p style="color:green"></p>

**Output:

**Example 2: In the below code, function is passed to the blur method.

HTML `

<script>
    <!--jQuery code to show blur method-->
        $(document).ready(function () {
            $("input").blur(function () {
                $(this).css("background-color", "#ADFF2F");
            });
        });
</script>

Enter Value:

**Output: