Alterar regras de classe CSS dinamicamente com jQuery

Sua consulta envolve dois aspectos:

1. Modificando regras de classe em tempo real

jQuery sozinho não pode alterar regras de classe CSS dinamicamente. No entanto, você pode utilizar a propriedade styleSheets do objeto document para acessar regras CSS diretamente.

Code:

document.getElementById("button").onclick = function() {
    var ss = document.styleSheets;

    for (var i = 0; i 
2. Salvando alterações de classe em arquivo
Para salvar alterações de classe em um arquivo, você precisa extrair as regras CSS e enviá-las ao servidor por meio de uma solicitação Ajax. A implementação do lado do servidor envolve a criação ou atualização de um arquivo com as regras modificadas.
Notas adicionais:
Para compatibilidade com o IE6, use document.styleSheets em vez de document.styleSheets.
Para obter as regras CSS, acesse a propriedade regras do objeto de folha de estilo.
Use a propriedade cssText para definir ou modificar regras CSS.
Referências:
document.styleSheets (Mozilla): https://developer.mozilla.org/en-US/docs/Web/API/Document/styleSheets
objeto styleSheet (Mozilla): https://developer.mozilla.org/en-US/docs/Web/API/StyleSheet
Objeto CssRule (Mozilla): https://developer.mozilla .org/en-US/docs/Web/API/CSSRule
document.styleSheets (MSDN): https://docs.microsoft.com/en-us/previous-versions/windows/internet-explorer /ie-developer/dom/document.stylesheets
Objeto CSSRule (MSDN): https://docs.microsoft.com/en-us/previous-versions/windows/internet-explorer/ie-developer/ dom/cssrule