динамическое обновление

Есть поле со списком при выборе которого должна меняться цена как сделать что бы при изменение выбора тарифа цена менялась, сейчас меняется только меняется при загрузки страницы

Код:

<select name="times" class="input-block-level" id="country">
<option value="--Выберите тариф--">--Выберите тариф--</option>
<option value="Mini" selected>Mini</option>
<option value="Normal">Normal</option>
<option value="Medium">Medium</option>
<option value="Pro"> Pro</option></select>
<script type='text/javascript'>
var TYPE=document.getElementById('country').value;
if (TYPE == 'Mini') {document.write('<h3>Итого: 1500 Руб</h3>');}
if (TYPE == 'Normal') {document.write('<h3>Итого: 3000 Руб</h3>');}
if (TYPE == 'Medium') {document.write('<h3>Итого: 5000 Руб</h3>');}
if (TYPE == 'Pro') {document.write('<h3>Итого: 10 000 Руб</h3>');}
</script>

 

Вот я делал одному чуваку мини калькулятор со списками и т.п.

JS код:

HTML структура:

 

если есть jquery то можно сделать так

Код:

$(document).ready(funcion(){
$('#country').change(function(){
var val = $('#country :selected').val(),
sum=0;
switch(val){
  case 'Mini': sum=1500; break;
  case 'Normal': sum=3000; break;
  case 'Medium': sum=5000; break;
  case 'Pro': sum=10000; break;
}
var h3=$('<h3>').html('Итого: '+sum+' руб');
$('#id_elementa_kuda_pisat').html(h3);
})
})

но я бы в опции ввел атрибут data-sum='3000...10 000' и получал в скрипте не через .val() а через .data('sum'). Тогда можно код упростить:

Код:

$(document).ready(funcion(){
$('#country').change(function(){
var sum = $('#country :selected').data('sum');
var h3=$('<h3>').html('Итого: '+sum+' руб');
$('#id_elementa_kuda_pisat').html(h3);
})
})