jquery show/hide Effect with radio button...!!!

Jquery show/hide Effect with radio button

In dr-wordpress Today i going to share an important example of jquery.
I am Also badly stuck, when i am doing this.
So i am sharing this code with you people..
<!-----------------------------------------------HTML CODE------------------------------------>
<form>
<input id="id_radio1" type="radio" name="name_radio" value="value_radio1" checked="checked"/>Radio1

<input id="id_radio2" type="radio" name="name_radio" value="value_radio2" />Radio2

<input id="id_radio3" type="radio" name="name_radio" value="value_radio3" />Radio3
                 
</form>
              <div id="divs">
                   <div id="div1">One</div>
                   <div id="div2">Two</div>
                   <div id="div3">Three</div>     

              </div>
<!-----------------------------------------------CSS CODE----------------------------------------->
#divs div {
    display:none;

}
<!-----------------------------------------------Jquery CODE-------------------------------------->
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script>
 $(function() {
          var $divs = $('#divs > div');
          $divs.first().show()
          $('input[type=radio]').on('change',function() {
                  $divs.hide();
                  $divs.eq( $('input[type=radio]').index( this ) ).show();
           });

});
<script>

Subscribe Dr-Wordpress for Important Knowledge of wordpress..your's suggestions are most welcomed.