dom - How can I hide and show div by clicking a radio button using javascript? -

i have 2 divs like

<div id="exist"> <p>ok</p> </div>  <div id="new">     <p>not ok</p> </div> 

i have 2 radio buttons like

  <label class="radio">     <input type="radio" name="optionsradios" id="exist_radio" value="existing" checked="">existing   </label>   <div style="clear:both"></div>   <label class="radio">     <input type="radio" name="optionsradios" id="new_radio" value="new">new   </label> 

now have show 1 div clicking radio button.
how can in javascript?

  /* js */   window.onload    = (function(){      var radio1      = document.getelementbyid('exist_radio');     var radio2      = document.getelementbyid('new_radio');     var div1        = document.getelementbyid('exist');     var div2        = document.getelementbyid('new');      //....      var show = function(id)     {         id.style.display = 'block';     }      var hide = function(id)     {         id.style.display = 'none';     }           hide(div1);     hide(div2);      radio1.onclick = function()     {         hide(div1);         show(div2);     }      radio2.onclick = function()     {         hide(div2);         show(div1);     }    }); 

for document.getelementbyid... can write wrapper of course

note: sample it's show how native javascript... production recommend split logic of events, operation, etc. , use backbone :)