I'm using jQuery's color slider for a project. Basically I'm setting the initial RGB values outside the function. When the function is first loaded, the code below works as it should. I play with the color slides, and everything works great.

But then, when I need to reload the color function within my project, how can I make it remember the RGB values where I left off? Right now, the color slider always goes back to 50, 50, 50 (RGB) when the function is reloaded. Thanks in advance. Here's my code so far...

var setred = 50;
var setgreen = 50;
var setblue = 50;

function myColors() {
 
  function hexFromRGB(r, g, b) {
  var hex = [
  r.toString( 16 ),
  g.toString( 16 ),
  b.toString( 16 )
  ];
  $.each( hex, function( nr, val ) {
  if ( val.length === 1 ) {
  hex[ nr ] = "0" + val;
  }
  });
  return hex.join( "" ).toUpperCase();
  }
  function refreshSwatch() {
   var red1 = $( "#red1" ).slider( "value" ),
   green1 = $( "#green1" ).slider( "value" ),
   blue1 = $( "#blue1" ).slider( "value" ),
   hex = hexFromRGB( red1, green1, blue1 );
   $(".step1first").css( "color", "#" + hex );
   leche1red = $( "#red1" ).slider( "value" );
   leche1green = $( "#green1" ).slider( "value" );
   leche1blue = $( "#blue1" ).slider( "value" );
   }
  $(function() {
   $( "#red1, #green1, #blue1" ).slider({
   orientation: "horizontal",
   range: "min",
   max: 255,
   value: 0,
   slide: refreshSwatch,
   change: refreshSwatch
   }
   );
  $( "#red1" ).slider( "value", setred );
  $( "#green1" ).slider( "value", setgreen );
  $( "#blue1" ).slider( "value", setblue );
  
  });

}