<div>
  <span class="p_name">Strenght:</span>
  <span class="p_value" id="str_value">340</span>
 </div>
<input class="xxx" type="range" max="1000" value="340" id="str_input">
 <div>
  <span class="p_name">Agility:</span>
  <span class="p_value" id="agl_value">760</span>
 </div>
<input class="xxx" type="range" max="1000" value="760" id="agl_input">

 <div>
  <span class="p_name">Intellect:</span>
  <span class="p_value" id="int_value">460</span>
 </div>
<input class="xxx" type="range" max="1000" value="460" id="int_input">

 <div>
  <span class="p_name">Stamina:</span>
  <span class="p_value" id="stm_value">340</span>
 </div>
<input class="xxx" type="range" max="1000" value="340" id="stm_input">

 <div>
  <span class="p_name">Stealth:</span>
  <span class="p_value" id="inv_value">1000</span>
 </div>
<input class="xxx" type="range" max="1000" value="1000" id="inv_input">

<div>
  <span class="p_name">Sapience:</span>
  <span class="p_value xxx" id="sap_value">100</span>
 </div> 
<input class="xxx" type="range" max="1000" value="100" id="sap_input">
document.addEventListener('input', ({ target: t }) => {
  if (t.classList.contains('xxx')) {
    t.previousElementSibling.querySelector('.p_value').innerText = t.value;
  }
});

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.