# How to test which button is checked of an existing radio buttons family?
**URL:** https://discourse.processing.org/t/how-to-test-which-button-is-checked-of-an-existing-radio-buttons-family/2849
**Category:** Coding Questions
**Created:** [August 22, 2018, 1:14pm UTC](https://discourse.processing.org/t/how-to-test-which-button-is-checked-of-an-existing-radio-buttons-family/2849 "2018-08-22T13:14:47Z")
**Posts on this page:** 3
**Page:** 1
Hi everyone. I’m used to write my own statitc html code into the index.html file of p5.js sketch. So I use the select() function of the DOM library to access html elements such INPUT of type text/passwordor or SELECT html elements and the use the value() function of the returned HTML object like in this sample code:
index.html
```auto
```
js:
```auto
firstname = select("#firstname").value();
lastname = select("#lastname").value();
```
It also works fine with SELECT elements too. But not with elements of radio types… For instance, the following code returns an error in the browser :
index.html
```auto
```
js.code
` alert(select("gender").value());`
I get the following error message into the browser (Chrome):
> Uncaught TypeError: Cannot read property ‘value’ of null
I’ve found an alternative with pure Javascript (see below), but it’s embarrassing with students into a beginners lesson. It’s very easy to read value of various HTML input, excepted radio buttons…
The p5.js documentation shows samples that works fine with dynamically generated radio button 🙂
[https://p5js.org/reference/#/p5/createRadio](https://p5js.org/reference/#/p5/createRadio)
Any idea? Thanks a lot.
Laurent
Pure JS “heavy” alternative:
```auto
genderRadios = document.getElementsByName("gender");
if(genderRadios[0].checked){
gender = "female";
} else if(genderRadios[1].checked) {
gender = "male";
}
```
---
> [@Laurent](#):
>
> `alert(select("gender").value());`
According to method p5::**select()**'s reference: [reference | p5.js](http://p5js.org/reference/#/p5/select) 👨🏫
> Searches the page for an element with the given ID, class, or tag name (using the ‘#’ or ‘.’ prefixes to specify an ID or class respectively, and none for a tag) and returns it as a p5.Element.
When passing a String to p5::**select()** w/ no ‘#’ or ‘.’ prefix in it, it means that String is the ``'s name itself.
Here’s some online p5js sketch which I use p5::**select()** to get the element w/ a specified `` name: 🙃
>
```auto
createP('Temp: '.bold() + `${weather.main.temp}${F}`);
createP('Wind: '.bold() + `${weather.wind.speed}${MPH}`);
temp = select('temp'), deg = select('deg');
wind = select('wind'), vel = select('vel');
```
> [@Laurent](#):
>
> `genderRadios = document.getElementsByName("gender");`
I don’t think p5js got any equivalent for **getElementsByName()**, which searches for all elements w/ a specified _name_ attribute!
Instead p5js got p5::**selectAll()**: [reference | p5.js](https://p5js.org/reference/#/p5/selectAll)
Which can search for all elements w/ a specified `` or a _class_ attribute name:
> Searches the page for elements with the given class or tag name (using the ‘.’ prefix to specify a class and no prefix for a tag) and returns them as p5.Elements in an array.
---