Question: I am currently using the Twitter [bootstrap-slider](http://www.eyecon.ro/bootstrap-slider/) library, and have been trying to figure out how to change the max value after the slider has been initialized. This question on how to [retrieve the value](https://stackoverflow.com/questions/15736694/how-to-get-the-value-of-the-slider-bootstrap) was of some help, but I still cannot find the exact method to call. Here's what I have been trying so far:

JS:

```
$('#slider').slider({
    max: 100
});
$('#slider').slider({
    max: 200
});
console.log($('#slider').data('slider').max)

```

Console:

```
100

```

Setting the `$('#slider').data('slider').max` value directly also does not change the range of the slider itself, even thought the value has changed. Any help on setting the max value or re-initializing the slider would be much appreciated!!

Answer: 
You just need to apply `setValue` after you'v changed `$('#slider').data('slider').max`

```
$slider = $('#slider');

// Get current value
var value = $slider.data('slider').getValue();
// should be:
// var value = $slider.slider('getValue');
// but it doesn't work

// Change max
$slider.data('slider').max = 13;

// Apply setValue to redraw slider
$slider.slider('setValue', value);

```

<http://jsfiddle.net/23aPK/>
I had the same problem and the best solution I found was to destroy the slider and recreate it whenever I needed to change the range values. It's a little tricky because: 1) removing the slider also removes the original anchor tag; and 2) you need to save the css width of the old slider and use it for the new one.

Here's a simplified version of the code I used. If you have more than one slider on your page, then you'll need to be careful and only delete the one you need to update. 

HTML:

```
<div id="sliderDiv">
    <input id="mySlider" type="text" data-slider-tooltip="show"/> 
</div>

```

Javascript: 

```
//Call this function to create the slider for the first time 

function createSlider(minRange, maxRange){

   $('#mySlider').slider({
        min: minRange,
        max: maxRange,
    value: defaultValue
    }).on('slideStop', handleSliderInput);

}

//Call this function to destroy the old slider and recreate with new range values

function changeSliderRange(newMin, newMax){

    //Save old slider's css width
    var oldSliderWidth = $("#mySlider").css("width");

   //remove the old slider      
   $(".slider").remove();   

   //Recreate slider anchor tag with saved width value
   $("#sliderDiv").after("<input id='mySlider' type='text' style='display: none; width: "+ oldSliderWidth + ";'/>");

   //Now recreate the slider
   createSlider(newMin, newMax);
}

```