test select

by Core Doe

HTML

<script src="https://code.jquery.com/jquery-2.2.4.js"></script>

<div id="box">
  <div id="price">0</div>

  <select class="form-control " id="id1">
    <option value="0">Select:</option>
    <option value="110">110 Euro</option>
    <option value="120">120 Euro</option>
    <option value="130">130 Euro</option>
  </select>

  <select class="form-control " id="id2">
    <option value="0">Select:</option>
    <option value="10">10 Euro</option>
    <option value="20">20 Euro</option>
    <option value="30">30 Euro</option>
  </select>

  <select class="form-control " id="id3">
    <option value="0">Select:</option>
    <option value="210">210 Euro</option>
    <option value="220">220 Euro</option>
    <option value="230">230 Euro</option>
  </select>

</div>

CSS

body {
  font-size: 40px;
}

#box {
  margin: auto;
  width: 300px;
  background-color: beige;
  text-align: center;
  position: relative;
  top: 250px
}

JavaScript

$(function() {

  var optionVal = 0;

  $('select').on('change', function(e) {
    optionVal += +$(e.target).val();

    $('#price').text(optionVal);
  });
});