javascript - select - how to sum values of selected options using jquery? -

how sum selection options in multiple attribute? idea might problem?

    $(document).ready(function() { $('#btn-add').click(function(){     $('#select-from option:selected').each( function() {             $('#select-to').append("<option value='"+$(this).val()+"'>"+$(this).text()+"</option>");         $(this).remove();     }); }); $('#btn-remove').click(function(){     $('#select-to option:selected').each( function() {         $('#select-from').append("<option value='"+$(this).val()+"'>"+$(this).text()+"</option>");         $(this).remove();     });  });   $('.select-from option:selected').change(function() {  var total = 0 ;   $('.select-to option:selected').each(function() {       total += parseint($(this).value());   });                $("input[name=class]").value(total);  }); }); 

i have multiple selection list options

<select name="selectfrom" id="select-from" multiple size="5">   <option value="1">item 1</option>   <option value="2">item 2</option>   <option value="3">item 3</option>   <option value="4">item 4</option> </select>  <a href="javascript:void(0);" id="btn-add">add &raquo;</a> <a href="javascript:void(0);" id="btn-remove">&laquo; remove</a>  <select name="selectto" id="select-to" multiple size="5"> </select>    <input type="text" name="class" value="" />  

try following code.

$(document).ready(function() {       $('#btn-add').click(function(){      $('#select-from option:selected').each( function() {              $('#select-to').append("<option value='"+$(this).val()+"'>"+$(this).text()+"</option>");          $("input[name='class']").val(parseint($(this).val()) + parseint($("input[name='class']").val()));      });  });  $('#btn-remove').click(function(){      $('#select-to option:selected').each( function() {          $('#select-from').append("<option value='"+$(this).val()+"'>"+$(this).text()+"</option>");          $(this).remove();          $("input[name='class']").val(parseint($("input[name='class']").val() - parseint($(this).val())));      });    });       });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>  <select name="selectfrom" id="select-from" multiple size="5">    <option value="1">item 1</option>    <option value="2">item 2</option>    <option value="3">item 3</option>    <option value="4">item 4</option>  </select>    <a href="javascript:void(0);" id="btn-add">add &raquo;</a>  <a href="javascript:void(0);" id="btn-remove">&laquo; remove</a>    <select name="selectto" id="select-to" multiple size="5">  </select>    <input type="text" name="class" value="0" />