Menu Close

Jquery checked selector with example


In this blog, we will learn about how to use :checked selector to html elements. This selector is used to select all checked checkboxes, radio buttons, and options of select elements. The below example shows the checked checkboxes.



Follow the below snippet to learn about :checked selector in jQuery.


<!DOCTYPE html>
<html lang="en">
    <title>Jquery :checked selector</title>
    <meta charset="utf-8">
    <script src=""></script>
    <meta name="viewport" content="width=device-width, initial-scale=1">
            $(":checked").wrap("<span style='background-color:#ff0000'>");
        .form-style {
            text-align: left;
        form {
            font-weight: bold;
            font-size: 25px;
            color: #4000ff;
    <div class="form-style">
    <form action="">
        Name: <input type="text" name="user"><br>
        Ticket 1: <input type="checkbox" name="ticket" value="ticket1"><br>
        Ticket 2: <input type="checkbox" name="ticket" value="ticket2"><br>
        Ticket 3: <input type="checkbox" name="ticket" value="ticket3" checked="checked"><br>
        <input type="submit">
Posted in jQuery, Web Technologies

You can also read...