click on .dinp here changes its color but I need to change the color of its thumb (circle) instead
$('.dinp').on('click', function(){
$('.dinp').css('background', '#bbb');
$(this).css('background', 'red');
});.dinp{
-webkit-appearance: none;
appearance: none;
display:block;
background:#bbb;
height:4px;
margin-top:20px;
cursor:pointer;
}<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type='range' min='-100' max='100' value='0' class='dinp'>
<input type='range' min='-100' max='100' value='0' class='dinp'>
<input type='range' min='-100' max='100' value='0' class='dinp'>