<label>
  <input class="checkbox" type="checkbox" value="10">
  one
</label>

<label>
  <input class="checkbox" type="checkbox" value="5">
  two
</label>

<label>
  <input class="checkbox" type="checkbox" value="2.7">
  three
</label>

<span class="price"></span>
label {
  display: block;
}
  $('.checkbox').on('change', function() {
    var prices = $('.checkbox:checked').map(function () {
      return parseFloat(this.value)
    }).get()
    
    if (prices.length) { 
      $('.price').text(
        Math.min.apply(null, prices) + 
        ' - ' +
        Math.max.apply(null, prices)
      )      
    } else {
      $('.price').text('')
    }
})
Run Pen

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

  1. https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js