JSFiddle - React, Tailwind, and code Playground

HTML

<input type="range" id="scale_range" min="100" max="500" value="250"/>

<div class="main-content_datafield">1.</div>
<div class="main-content_datafield">2.</div>
<div class="main-content_datafield">3.</div>

<div id="demo" onclick="changrange()"></div>

CSS

.main-content_datafield {
    width: 250px;
    background: red;
}

JavaScript

var scale_range = document.getElementById('scale_range');
demo = document.getElementById("demo");
            
scale_range.onchange = function() {
     demo.innerHTML = this.value;
                
     document.getElementsByClassName("main-content_datafield").style.width = this.value;
}