Agregar Estilos Extras a div/span

[Alexis88]

Lo único que tendrías que hacer es verificar si el checkbox está o no marcado y, según sea el caso, tomar a ambos <span> y modificar su visibilidad.

Código Javascript:

var checkbox = document.querySelector("#id del checkbox"),
    spanON = document.querySelector(".clase del span ON"),
    spanOFF = document.querySelector(".clase del span OFF");
 
checkbox.addEventListener("change", function(){ //Cuando cambie el estado del checkbox
    if (this.checked){ //Si el checkbox ha sido marcado
        spanON.style.display = "block";
        spanOFF.style.display = "none";
    }
    else{ //Si el checkbox ha sido desmarcado
        spanON.style.display = "none",
        spanOFF.style.display = "block";
    }
}, false);
 

No olvides colocar este código luego del último elemento del documento y justo antes de la etiqueta </body> para que surta efecto.

Saludos