javascript - Determining when a radio button selection has changed with YUI3 -

i using yui3 , internet explorer 8 , firefox. trying determine when radio button has changed selection.

my html:

<div id="test">      <input name="test1" value="a" type="radio">      <input name="test1" value="b" type="radio">      <input name="test1" value="c" type="radio"> </div> 

my javascript:

yui().use('event', 'node', function (y) {      y.one('input[name=test1]').on('change', function (e) {           alert('changed');      }); }); 

this doesn't work because page loads nothing selected in radio button group. when select first item nothing happens, no alert pops up. when click second button pops up. how determine when radio button selection has changed?

also how value of selected radio button, think there ie issues? bombs out:

var value = y.one('input[name=test1]:checked').get('value'); alert(value); 

and bring nothing:

var value = y.all('input[name=test1]:checked').get('value'); alert(value); 

you can use event delegation listen "click" event. if don't know event delegation is, check out this short intro. change event has issues in older browsers stick click event. need parent element y.one , set delegation listener:

yui().use('node', function (y) {   y.one('#test').delegate('click', function (e) {     alert(e.target.get('value'));   }, 'input[type=radio]'); });