[javascript]Radio 라디오버튼 선택시 나타나는 div 구현

이전 내용에서 체크박스 선택시 나타나는 div 구현 했는데요.

라디오 버튼을 이용해서 구현하는 스크립트를 보여드립니다.

<script>
function showDiv() {
    var radios = document.querySelectorAll('input[type=radio]');
    for (var i = 0; i < radios.length; i++) {
        var radio = radios[i];
        var div = document.getElementById('myDiv' + (i + 1));
        if (radio.checked == true){
            div.style.display = "block";
        } else {
           div.style.display = "none";
        }
    }
}
</script>

<input type="radio" id="myRadio1" name="myRadio" onclick="showDiv()"> 라디오1
<input type="radio" id="myRadio2" name="myRadio" onclick="showDiv()"> 라디오2
<input type="radio" id="myRadio3" name="myRadio" onclick="showDiv()"> 라디오3
<div id="myDiv1" style="display:none">라디오 버튼1을 선택하면 나타나는 div입니다.</div>
<div id="myDiv2" style="display:none">라디오 버튼2을 선택하면 나타나는 div입니다.</div>
<div id="myDiv3" style="display:none">라디오 버튼3을 선택하면 나타나는 div입니다.</div>