html - Javascript slider not displaying array? -

here's link page i'm working on:

https://www.servicerr.com/partners.php

whenever click on different numbers, should update prices below slider. javascript file contains prices:

https://www.servicerr.com/js/set_my_price.js 

what can't figure out why prices won't change , why every number staying highlighted when click 1 of next.

about year ago, had working , had re-create it. can't figure out i'm doing wrong time around. appreciated.

here links 2 other files javascript files make work:

here's html code being used:

  <div class="product2" style="margin-right:2%">     <div class="title">starter</div>     <div class="monthly">partner discount</div>     <ul>     <div class="servicerr-pricing-packet starter"><span class="original"><span style="font-weight: bold; border-bottom: 0px none; color: rgb(0, 125, 199); font-size: 70px; white-space:nowrap;margin:0 !important;">$34.96</span></span></div>     <p style="font-size:20px;color:#000;margin-top:20px;border:0;padding:5px 0 0 !important;">website / monthly</p>     </ul>     <div class="order"><a href="https://www.servicerr.com/contact.php" style="font-size: 25px;" class="btn btngreen">become partner</a></div>   </div>   <div class="product" style="margin-right:2%">     <div class="title">specialized</div>     <div class="monthly">partner discount</div>     <ul>     <div class="servicerr-pricing-packet specialized"><span class="original"><span style="font-weight: bold; border-bottom: 0px none; color: rgb(0, 125, 199); font-size: 70px; white-space:nowrap;margin:0 !important;">$69.96</span></span></div>     <p style="font-size:20px;color:#000;margin-top:20px;border:0;padding:5px 0 0 !important;">website / monthly</p>     </ul>     <div class="order"><a href="https://www.servicerr.com/contact.php" style="font-size: 25px;" class="btn btngreen">become partner</a></div>   </div>   <div class="product2">     <div class="title">business</div>     <div class="monthly">partner discount</div>     <ul>     <div class="servicerr-pricing-packet business"><span class="original"><span style="font-weight: bold; border-bottom: 0px none; color: rgb(0, 125, 199); font-size: 70px; white-space:nowrap;margin:0 !important;">$174.96</span></span></div>     <p style="font-size:20px;color:#000;margin-top:20px;border:0;padding:5px 0 0 !important;">website / monthly</p>     </ul>     <div class="order"><a href="https://www.servicerr.com/contact.php" style="font-size: 25px;" class="btn btngreen">become partner</a></div>   </div> 

here's set_my_price.js code:

var set_default_value_here = 25; $(document).ready(function(){  $("."+set_default_value_here).css('color', '#ffbb50');  });  function get_array(val){                     var 1 = new array(1, '49.95', '99.95', '249.95');                     var 2 = new array(5, '39.96', '79.96', '199.96');                     var 3 = new array(10, '37.46', '74.96', '187.46');                     var 4 = new array(25, '34.96', '69.96', '174.96');                     var 5 = new array(50, '32.47', '64.97', '162.47');                     var 6 = new array(75, '29.97', '59.97', '149.97');                     var 7 = new array(100, '27.47', '54.97', '137.47');                     var 8 = new array(200, '24.97', '49.97', '124.97');                     var 9 = new array(300, '22.48', '44.98', '112.48');                     var ten = new array(400, '19.98', '39.98', '99.98');                     var eleven = new array(500, '17.48', '34.98', '87.48');                     var twelve = new array(600, '14.98', '29.98', '74.98');                     var thirteen = new array(700, '12.49', '24.99', '62.49');                     var fourteen = new array(800, '9.99', '19.99', '49.99');                     var fifteen = new array(900, '7.49', '14.99', '37.49');                     var sixteen = new array(1000, '4.99', '9.99', '24.99');                       if(val == 1){return one;}                     if(val == 2){return two;}                     if(val == 3){return three;}                     if(val == 4){return four;}                     if(val == 5){return five;}                     if(val == 6){return six;}                     if(val == 7){return seven;}                     if(val == 8){return eight;}                     if(val == 9){return nine;}                     if(val == 10){return ten;}                     if(val == 11){return eleven;}                     if(val == 12){return twelve;}                     if(val == 13){return thirteen;}                     if(val == 14){return fourteen;}                     if(val == 15){return fifteen;}                     if(val == 16){return sixteen;}                   } 

the pricing file:

$(document).ready(function(){ var sliderupdate = "";     if ($('#servicerr-pricing-slider').length > 0) {          var slider = null;          if ($.fn.bootstrapslider) {             slider = $('#servicerr-pricing-slider').bootstrapslider();         } else {             slider = $('#servicerr-pricing-slider').slider();         }          slider.on('slide', sliderupdate);         slider.on('slidestop', sliderupdate);     }  }); 

i'm utilizing modified version of original bootstrap-slider.js long post here, can viewed directly: https://www.servicerr.com/js/bootstrap-slider.js

thanks!

looks have been messing original code:

/**/ var old_no = get_array( document.getelementbyid('servicerr-pricing-slider').value) ; $(".color_less").css('color', '#08619f');  var no = get_array(a);  $("."+no[0]).css('color', '#ffbb50'); //alert(no[0]); $("#starter").html("$"+no[1]); $("#specialized").html("$"+no[2]); $("#business").html("$"+no[3]); /**/ 

why stays highlighted:

$(".color_less") won't match element, there ain't element class.

you can add class or change $("#servicerr-pricing-slider-nums span")

why aren't prices changing:

$("#specialized") looking element id, have specified class on element. change both class or id can matched. preferably id of course.