chained ifs, correct use

Question

I am creating a function that takes the values of a table that are in range, 1-49, 50-99, 100-199, ..., 300+, the code takes the value of an input and based on this value identifies the range and calculates the value of the product.

So far the code works well, taking the value of the input, what happens is that when the value of the input is in 1000 it executes the 3º if instead of the 5º, I believe it is some problem with the chained if, but I can not visualize. Will someone help me? (ps. pfv don’t cuss me because I wrote variables starting with capital letters)

        var Th1 = document.getElementById('th_1').innerHTML;
        var Th2 = document.getElementById('th_2').innerHTML;
        var Th3 = document.getElementById('th_3').innerHTML;
        var Th4 = document.getElementById('th_4').innerHTML;
        var Th5 = document.getElementById('th_5').innerHTML;

        var Vl1 = Th1.slice(0, Th1.indexOf("-"));
        var Vl2 = Th1.slice(Th1.indexOf("-") + 1);

        var Vl3 = Th2.slice(0, Th2.indexOf("-"));
        var Vl4 = Th2.slice(Th2.indexOf("-") + 1);

        var Vl5 = Th3.slice(0, Th3.indexOf("-"));
        var Vl6 = Th3.slice(Th3.indexOf("-") + 1);

        var Vl7 = Th4.slice(0, Th4.indexOf("-"));
        var Vl8 = Th4.slice(Th4.indexOf("-") + 1);

        var Vl9 = Th5.slice(0, Th5.indexOf("+"));
        var Vl10 = Th5.slice(Th5.indexOf("+") + 1);


        var q = Number(document.getElementById('pwrqto').value);
        var s = document.getElementById('xprice');

        //se o valor estiver no range 1
        if((q >= Vl1) && (q <= Vl2)){
            var cat =  document.getElementById('rs_0');
            var child = cat.childNodes[0].innerHTML;
            var cleanCp = child.slice(child.indexOf(";") + 1);

            s.innerHTML = 'R$ ' + Math.ceil(cleanCp.replace(",", ".") * q) + ',00';
        }
        //se o valor estiver no range 2
        if((q >= Vl3) && (q <= Vl4)){
            var cat =  document.getElementById('rs_1');
            var child = cat.childNodes[0].innerHTML;
            var cleanCp = child.slice(child.indexOf(";") + 1);

            s.innerHTML = 'R$ ' + Math.ceil(cleanCp.replace(",", ".") * q) + ',00';
        }
        //se o valor estiver no range 3
        if((q >= Vl5) && (q <= Vl6)){
            var cat =  document.getElementById('rs_2');
            var child = cat.childNodes[0].innerHTML;
            var cleanCp = child.slice(child.indexOf(";") + 1);

            s.innerHTML = 'R$ ' + Math.ceil(cleanCp.replace(",", ".") * q) + ',00';
        }
        //se o valor estiver no range 4
        if((q >= Vl7) && (q <= Vl8)){
            var cat =  document.getElementById('rs_3');
            var child = cat.childNodes[0].innerHTML;
            var cleanCp = child.slice(child.indexOf(";") + 1);

            s.innerHTML = 'R$ ' + Math.ceil(cleanCp.replace(",", ".") * q) + ',00';
        }
        //se o valor estiver no range 5
        if(q >= Vl9) {
            var cat =  document.getElementById('rs_4');
            var child = cat.childNodes[0].innerHTML;
            var cleanCp = child.slice(child.indexOf(";") + 1);

            s.innerHTML = 'R$ ' + Math.ceil(cleanCp.replace(",", ".") * q) + ',00';
        }

Below the HTML Code

<table><tbody>
  <tr class="wc_quantity">
     <th id="th_1">1-49</th>
     <th id="th_2">50-99</th>
     <th id="th_3">100-199</th>
     <th id="th_4">200-299</th>
     <th id="th_5">300+</th>
  </tr>
  <tr class="wc_price">
     <td align="center" id="rs_0"><span class="amount">R$&nbsp;10,00</span></td>
     <td align="center" id="rs_1"><span class="amount">R$&nbsp;9,50</span></td>
     <td align="center" id="rs_2"><span class="amount">R$&nbsp;9,30</span></td>
     <td align="center" id="rs_3"><span class="amount">R$&nbsp;9,20</span></td>
     <td align="center" id="rs_4"><span class="amount">R$&nbsp;9,10</span></td>
  </tr>

Answer 1

This is more suitable, more readable and faster.

switch (q)
{   
     //se o valor estiver no range 1
    case ((q >= Vl1) && (q <= Vl2)):
        ...
        break;

    //se o valor estiver no range 2
    case ((q >= Vl3) && (q <= Vl4)): 
        ...
        break;
    //se o valor estiver no range 3
    case ((q >= Vl5) && (q <= Vl6)):
        ... 
        break;
    //se o valor estiver no range 4
    case ((q >= Vl7) && (q <= Vl8)):
        ...
        break;
    //se o valor estiver no range 5
    default:
        ...  
 }