¿Cómo cambiar la hoja de estilo secundaria con Jquery?

Question

Tengo mi base.css y un red.css en mi sitio.

Me gusta cambiar red.css por blue.css cuando presiono algún botón, sin base.css perdida ¿cómo hacer esto? He intentado esto:

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.0/jquery.min.js"></script> 

<script type="text/javascript"> 
    if($.cookie("css")) { 
    $("link").attr("href",$.cookie("css")); 
    } 
$(document).ready(function(){ 
    $("#troca_faccao").click(function() { 
     $(this).parent().find("#painel_faccao").slideDown('fast').show(); //Drop down the subnav on click 
     $(this).hover(function() { 
     }, function(){ 
      $(this).parent().find("#painel_faccao").slideUp('slow'); //When the mouse hovers out of the subnav, move it back up 
      }); 
     }) 
    $("#painel_faccao li a").click(function() { 
     $("link").attr("href",$(this).attr('rel')); 
     $.cookie("css",$(this).attr('rel'), {expires: 365, path: '/'}); 
    return false; 
    }); 
}); 
</script> 

y div:

     <div id="painel_faccao" style="display: none"> 
         <p>A Escolha é Sua!</p> 
         <ul> 
          <li class="horda"><a href="#" rel="horde.css">HORDA</a></li> 
          <li class="alianca"><a href="#" rel="aliance.css">ALIANÇA</a></li> 
         </ul></div> 

Answer 1

Usted puede utilizar :eq selector de filtro o eq() método para dirigir la hoja de estilo que desee:

$("link:eq(0)").attr("href",$(this).attr('rel')); 

Especifique la posición a eq para la hoja de estilos que desea cambiar el href. Fuera de curso que desea cambiar el href de enlace de hoja de estilo que apunta a red.css y no base.css

---

Alternativamente, se puede aplicar una id a la hoja de estilo enlace que desea cambiar el href de L

<link id="someID"............/> 

Y posteriormente hacer:

$("link#someID").attr("href",$(this).attr('rel')); 

Answer 2

http://www.cssnewbie.com/simple-jquery-stylesheet-switcher/

tl; dr:

En algún lugar de su HTML:

<link id="styles" rel="stylesheet" type="text/css" href="red.css" /> in HTML 

En algún lugar de su jQuery:

$("#styles").attr("href","blue.css");