Difference between onClick() and onChange() for radio buttons

Question

<input type="radio" name="group" value="book_folder" onchange="makeRadioButtons()">Create New Book</input>  <input type="radio" name="group" value="book_chapter" onchange="makeCheckBoxes()">Create New Chapter</input> 

I was using the above code and when I clicked the second radio button, I thought I should get two events, one from the button that got unchecked and other from the button that got checked, because logically speaking, both buttons got their state changed, and I have bound the onchange() event not the onclick() event. But as it seems I only get one event from the button that just got checked. Is this a desired behaviour in HTML? How can I get an event from the button if it got unchecked?

Answer 1

Use this to get the desired behavior:-

var ele = document.getElementsByName('group'); var i = ele.length; for (var j = 0; j < i; j++) {     if (ele[j].checked) { //index has to be j.         alert('radio '+j+' checked');     }     else {         alert('radio '+j+' unchecked');     } } 

Hope it helps.