NueveReinas

HTML

<link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.2/jquery.mobile-1.4.2.min.css">
<script src="http://code.jquery.com/mobile/1.4.2/jquery.mobile-1.4.2.min.js"></script>
<fieldset>
  <div data-role="fieldcontain">
    <label for="select-based-flipswitch">Select-based:</label>
    <select id="select-based-flipswitch" data-role="flipswitch">
      <option value="leave">Bye</option>
      <option value="arrive">Hi</option>
    </select>
  </div>
</fieldset>

<div class="ejemplo"></div>

CSS

.ejemplo {
    background:red; /* color inicial del ejemplo */
    width:200px;
    height:50px;
}

JavaScript

$('#select-based-flipswitch').on('change', function() { //Función que ocurre si se produce un cambio en el "flipswitch
    
    if ( $('#select-based-flipswitch').val() == "leave" ){ //Si el valor es igual a "leave", entonces
        $(".ejemplo").css("background","blue"); }; //el fondo del DIV será azul
    
    if ( $('#select-based-flipswitch').val() == "arrive" ){ //Si el valor es igual a "arrive", entonces
        $(".ejemplo").css("background","green"); } //el fondo del DIV será verde

});