I am trying to create drop down menu with a button.

My code is -

<div class=dropdown-plans>

<select id=basic_plan name=bill_cycle>

<option value=tri> 3 Years - Rs. 100/month </option>

<option value=bi> 2 Years - Rs. 200/month </option>

<option value=ann> 1 Year - Rs. 100/month </option>

</select>

</div>



<div class=button-plans>

<a href=somelink> Order now </a>

</div>

Depending on what option i select from dropdown, the href value somelink should change.
For instance if i select 1 year. href value should change from somelink to google.com

Update:

I searched two things. 1) Changing href using javascript and 2) using onchange for select tag. It lead me to create this following piece of code.

<script>



function getOpt(period) {



    if (period.value = tri) { document.getElementById(abc).href=tri.html; }

    else if (period.value = bi) { document.getElementById(abc).href=bi.html; }

    else { document.getElementById(abc).href=ann.html; } 

 }



</script>



<div class=dropdown-plans>



<select id=basic_plan name=bill_cycle onchange=getOpt(this)>



<option value=tri> 3 Years - Rs. 100/month </option>

<option value=bi> 2 Years - Rs. 200/month </option>

<option value=ann> 1 Year - Rs. 100/month </option>



</select>



</div>



<div class=button-plans>

<a id=abc href=something> Order now </a>

</div>

Problem: The drop down shows 3 years by default. But if i select 2 years, it still remains 3 years.