Значения на ползунке jquery

Подскажите, что делаю не так, может какую-то дополнительную библиотеку надо подключить? Не отображаются деления с цифрами на ползунке, причём в редакторе их видно, а на фронтенде нет.

<script type="text/javascript">


// все переменные
var
valueran1, valueran2, valuecalc;



// подсчёт результатов и вывод

$('[class^="custom-range"]').change(function() {
valueran1= jQuery ("#range1").val();
valueran2= jQuery ("#range2").val();
total1 = parseInt(valueran1) / 100 * 90;
$total1 = $('.total1');
$total1.val(total1);
document.getElementById('total1').innerText = total1;
document.getElementById('ong').innerText = valueran1;
document.getElementById('ong2').innerText = valueran2;

if (valueran2 <= 14) {
total2 = parseInt(total1) + parseInt(total1) * 0.03;
}
else {
total2 = parseInt(total1) + parseInt(total1) * 0.05;
}

$total2 = $('.total2');
$total2.val(total2);
document.getElementById('total2').innerText = total2;
});

</script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js" integrity="sha384-smHYKdLADwkXOn1EmN1qk/HfnUcbVRZyYmZ4qpPea6sjB/pTJ0euyQp0Mk8ck+5T" crossorigin="anonymous"></script>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" integrity="sha384-WskhaSGFgHYWDcbwN70/dfYBj47jz9qbsMId/iRN3ewGhXQFZCSftd1LZCfmhktB" crossorigin="anonymous">
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>

<div style="padding: 20px; width: 100%;">
<div style="width: 100%;">
<p class="badge badge-warning">Рыночная стоимость автомобиля от 200000 до 3000000</p>

<div id="ong" style="text-align: right; font-size: 20px;">200000</div>
<input type="range" class="custom-range" min="200000" max="3000000" step="50000" id="range1" value="200000" /></div>

<div style="width: 100%;">
<p class="badge badge-warning">Срок кредита от 1 до 30 дней</p>

<div id="ong2" style="text-align: right; font-size: 20px;">1</div>
<input type="range" list="tickmarks" class="custom-range" min="1" max="30" step="1" id="range2" value="1" /></div>
<datalist id="tickmarks">
<option value="0" label="0"></option>
<option value="1"></option>
<option value="2"></option>
<option value="3"></option>
<option value="4"></option>
<option value="5" label="5"></option>
<option value="6"></option>
<option value="7"></option>
<option value="8"></option>
<option value="9"></option>
<option value="10" label="10"></option>
<option value="11"></option>
<option value="12"></option>
<option value="13"></option>
<option value="14"></option>
<option value="15" label="15"></option>
<option value="16"></option>
<option value="17"></option>
<option value="18"></option>
<option value="19"></option>
<option value="20" label="20"></option>
<option value="21"></option>
<option value="22"></option>
<option value="23"></option>
<option value="24"></option>
<option value="25" label="25"></option>
<option value="26"></option>
<option value="27"></option>
<option value="28"></option>
<option value="29"></option>
<option value="30" label="30"></option>
</datalist>

<div class="row">
<div class="form-group col-md-6">
<p class="badge badge-warning">Сумма на руки:</p>

<div id="total1" style="font-size: 25px;">180000</div>
</div>
<div class="form-group col-md-6">
<p class="badge badge-warning">Сумма возврата:</p>

<div id="total2" style="font-size: 25px;">185400</div>
</div>
</div>
</div>


Ответы (0 шт):