Поместить текст в scrollbar

let width = 0; 
 
const bar = document.getElementById('percent'); 
const val = document.getElementById('value'); 
 
let timer = setInterval(function() { 
  width++; 
  bar.style.width = width + 'px'; 
  val.innerHTML = (width / 3).toFixed(1); 
  if (width > 300) { 
    clearInterval(timer); 
  } 
}, 20);

#scroll { 
  width: 300px; 
  height: 20px; 
  overflow: hidden; 
  border: 1px solid black; 
  position: relative; 
} 
 
#percent { 
  height: 20px; 
  float: left; 
  width: 0px; 
  background-color: green; 
} 
 
#some-text { 
  position: absolute; 
}

<div id="scroll"> 
  <div id="percent"></div> 
  <span id="some-text"><span id="value"></span>%</span> 
  <div>