jQuery :checked Selector

jQuery Web Development Front End Technology

The :checked selector in jQuery is used to look for all the checked radio button or checkboxes and selects them.

Syntax

The syntax is as follows −

$(":checked")

Example

Let us now implement the :checked selector in jQuery −

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
</head>
<body>
<h2>Favourite Subject</h2>
<form>
<div>
Maths: <input type="radio" name="sub" value="Maths">
</div>
<div>
English <input type="radio" name="sub" value="English">
</div><br>
<div id="content"></div>
</form>
<script>
   $( "input" ).on( "click", function() {
      $( "#content" ).html( $( "input:checked" ).val() + " is the favourite subject" );
   });
</script>
</body>
</html>