Handling One Radio Button With JavaScript

Today, I discovered an issue that I have probably encountered in the past; but it’s been so long I forgot about it. I had some JavaScript set up to select a radio button based on text input, and then update the text based on the selected radio button (it’s a TinyMCE plugin that inserts a shortcode into the WordPress visual editor). Throughout all of the testing I performed, everything worked just fine. Today, though, someone else was testing the interface and could not get the text or the radio button to update properly.

After a bit of testing and messing around with the interface, I finally discovered that my JavaScript wasn’t recognizing the existence of the radio button on the form. After a bit more testing, I realized that’s because only one radio button existed; and JavaScript doesn’t treat radio buttons as arrays when there’s only one instance. When I had been testing before, I had multiple radio buttons, so everything worked; but now there was only one button, so it fell over.