How to use the prop method In JQuery

The input can be accessed and its property can be set by using the prop() method. This method manipulates the ‘checked’ property and sets it to true or false depending on whether we want to check or uncheck it.

Syntax:

$("element").prop("checked", true)

Example: The below example uses the prop() method of jQuery to check the checbox.

html

<!DOCTYPE html>
 
<head>
    <title>
        How to check a checkbox with jQuery?
    </title>
 
    <script src=
"https://code.jquery.com/jquery-2.2.4.min.js">
    </script>
</head>
 
<body>
    <center>
        <h1 style="color: green">
            w3wiki
        </h1>
 
        <b>
            jQuery Check/Uncheck Checkbox
        </b>
 
        <p>
            <input
                type="checkbox"
                name="option"
                id="front">
            Front-End
 
            <input
                type="checkbox"
                name="option"
                id="back">
            Back-End
        </p>
 
        <p>
            <button
                type="button"
                class="check-front">
                Subscribe Front-End
            </button>
 
            <button
                type="button"
                class="check-back">
                Subscribe Back-End
            </button>
 
            <button
                type="button"
                class="reset">
                Reset
            </button>
        </p>
 
        <script type="text/javascript">
            $(document).ready(function () {
                $(".check-front").click(function () {
                    $("#front").prop("checked", true);
                });
                $(".check-back").click(function () {
                    $("#back").prop("checked", true);
                });
                $(".reset").click(function () {
                    $("#front").prop("checked", false);
                    $("#back").prop("checked", false);
                });
 
            }); 
        </script>
    </center>
</body>
 
</html>

Output:

How to check a checkbox with jQuery?

In this article, we will learn about the different methods to dynamically check a checkbox using jQuery. There are three methods by which you can dynamically check the currently selected checkbox by changing the checked property of the input type.