title: Need to change onClick value of a button to another value using select
body: <p>I am a little lost at this point in my project. I work for a company that provides translation services. Well, I am making a simple calculator to calculate the cost of a translation based on the number of words in the entire project. It also changes rate based on the amount of words entered. I have that part done. I wrote this and it works:</p>
  
  <pre><code>function wordcountprice(){
  var price,  final, 
      a=document.getElementById('words'),  
  wc= parseFloat(a.value) || 0;
  if(wc&lt; 10000) price= .29;
  else price= wc&lt;20000? .26: .24; 
  final= (wc*price).toFixed(2);
  document.getElementById('estPrice').innerHTML = 'Your estimated price is: $' + final;}
  </code></pre>
  
  <p>At this point we have 6 types of translation work. Five of them would use that function and the last one would use a basic function with a fixed price. I was thinking I would use a drop down select box to change functions.</p>
  
  <p>I am calling the above function in my HTML like this:</p>
  
  <pre><code>  &lt;input type="text" id="words"&gt;&amp;nbsp;&amp;nbsp;&lt;input type="button" id="button" value="Calculate" onClick="wordcountprice();"&gt; &lt;br /&gt;&lt;b id='estPrice'&gt;Estimated Price&lt;/b&gt;
  </code></pre>
  
  <p>I have tried several things and none of them have worked. I assume that the best way to go about this is jQuery's change() or select() function. I have tried making a new function with jQuery like this one:</p>
  
  <pre><code>$(function() {
  $('#type').change(function() {
      var type = $(this).val();
      $('#button').val(type);
  }); });
  </code></pre>
  
  <p>That only changes the value of the button and not the onClick event. I do not know how, or if, it is possible to change the onClick event like that. I don't even know if that is the most efficient method to do what I want to do. I called that function when I was trying it with this HTML:</p>
  
  <pre><code>&lt;select id='type'&gt;&lt;option value='1'&gt;A&lt;/option&gt;
  &lt;option value='2'&gt;B&lt;/option&gt;
  &lt;option value='3'&gt;C&lt;/option&gt;
  &lt;option value='4'&gt;D&lt;/option&gt;&lt;/select&gt;
  </code></pre>
  
  <p>I am a noob with jQuery and haven't been programming for a while so I am a little rusty. </p>
  
  <p>Thanks for the help in advance.</p>