In this blog, we will learn, how to know which radio button is checked in jQuery. Sometimes in websites or web applications, there is a need to know which radio button is checked. In jQuery there are two methods is(“:checked”) and prop(“checked”) by using these methods we can check radio button is checked or not. Let’s see the following solution:
Example1: Using is(": checked") method
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<input type="radio" class="radioButtons" name="radioGroup" value="1">1
<input type="radio" class="radioButtons" name="radioGroup" value="2">2
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script>
$(document).ready(function() {
$('.radioButtons').click(function(){
if($(this).is(":checked"))
{
alert($(this).val());
}
});
});
</script>
</body>
</html>
Example2: Using prop(“checked”) method:
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<input type="radio" class="radioButtons" name="radioGroup" value="1">1
<input type="radio" class="radioButtons" name="radioGroup" value="2">2
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script>
$(document).ready(function() {
$('.radioButtons').click(function(){
if($(this).prop("checked"))
{
alert($(this).val());
}
});
});
</script>
</body>
</html>