Need help with my html / css / javascript design

I am trying to create a file hosting website template, the problem is I redesigned the radio buttons for the div elements to have a custom image instead of the default circles with javascript.

This is image 1 when loading the default page

<script type="text/javascript">
<!--
//script to change background-color of the selected
//button and put the appropriate value in an input object
function btnClick(btnNum){
for (i=1;i<=4;i++){
tempBtnVal=document.getElementById('btnVal')
tempBtn=document.getElementById('btn'+i)
tempBtn.style.backgroundPosition=(i==btnNum?'0 -163px':'0 -30px')
tempBtn.style.color=(i==btnNum?'#333':'#6a7072')
}
tempBtnVal.value=btnNum
}
//-->
</script>

      

        
        
        
      

    

my html

<div id="btn1" name="btn1" class="buttonDiv" value='1' onclick="btnClick('1')" style="background: url(images/inSprite.png) no-repeat scroll 0 -163px; color:#333;"><div id="btnTxt">local</div></div>

<div id="btn2" name="btn2" class="buttonDiv" value='2' onclick="btnClick('2')"><div class="btnTxt">remote</div></div>

      

        
        
        
      

    

if i click on any other tab it works fine and that tab is selected

Image 2 when clicking on load url

but the script stores the cookie of the last selected tab, so the next time a person automatically visits the site, that tab is shown as I manually hardcoded the css into a div, it breaks the design like in the image below I selected Load URL and reloaded page

Image 3 after exiting the browser and viewing the site

the selector displays Form Loading, but instead the URL Loading tab is open.

Help me solve the problem to open the url showing the url given in the tab above.

I cannot use any framework due to the limitations, I can only use javascript, not the framework. Please help me solve as I have very little knowledge of javascript.

Many thanks.

Hello,

Shishant Todi