Member-only story
Get the Value of a Radio Button Using jQuery
2 min readMar 18, 2023
Hi friends, in this tutorial, you will learn how to get the value of a radio button using jQuery. This is a very simple process and we can do it with the help of javascript events like onclick event with a function inside the button HTML element and trigger that function within the script tag before the HTML body ends. In order to do this, you have to combine two types of attributes from the radio HTML element.
Steps to get value of a radio button using jQuery
Step 1:- Create an HTML file inside the root directory of your local server. In my case, it is a WAMP server.
Step 2:- Now, copy the below HTML code and paste it into the HTML file.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title></title>
</head>
<body>
<h3>Get Value of a radio button using jQuery</h3>
<input type="radio" name="gender" value="Male">Male
<input type="radio" name="gender" value="Female">Female
<br><br>
<input type="button" value="select" onclick="getData()">
<br><br>
Gender = <input type="text" id="get_gender">
<script src="https://code.jquery.com/jquery-3.6.4.min.js"></script>
<script…
