title: Onchange multiple select how to sum up the total in other input value
body: <p>I have a select option with <code>onchange</code> function that can change the value in other input whenever I click the option. </p>
  
  <p>However it is not working on multiple select which just only show the first select option value only when select many of the option.</p>
  
  <p>HTML select option code</p>
  
  <pre><code>&lt;select class="form-control" onchange="selectFunction(event)" 
  name="pay_course[]" required="" multiple&gt;
  
    &lt;option data-typeid="1111" value="courseId1"&gt;courseName1&lt;/option&gt;
    &lt;option data-typeid="2222" value="courseId2"&gt;courseName2&lt;/option&gt;
  &lt;/select&gt;
  </code></pre>
  
  <p>Input to be display the total  </p>
  
  <pre><code>&lt;input type="number" value="" id="money" class="form-control"&gt;
  </code></pre>
  
  <p>Function script</p>
  
  <pre><code>&lt;script&gt;
  function selectFunction(e) {
    var type_id = $('select option:selected').attr('data-typeid'); //to get value
    document.getElementById("money").value =type_id;
  }
  &lt;/script&gt;
  </code></pre>