# removeClass() jQuery: Como remover classes de elementos HTML

A princípio, a biblioteca jQuery foi criada para **simplificar a manipulação do DOM**. Especificamente, ao fazer uso do método .removeClass() jQuery, você consegue acessar elementos e remover classes CSS com total facilidade.

## O que é .removeClass() jQuery?

Com o método jQuery.removeClass(), você consegue remover uma ou mais classes CSS de um elemento selecionado, sem ter de alterar todo o valor do atributo de classe. Ao remover classes específicas, torna-se possível **controlar interativamente o estilo e o comportamento de um site**. Para adicionar classes, contudo, use o método [jQuery.addClass()](https://www.ionos.com/pt-br/digitalguide/sites-de-internet/desenvolvimento-web/addclass-jquery/). Já ao aplicar [jQuery.on()](https://www.ionos.com/pt-br/digitalguide/sites-de-internet/desenvolvimento-web/jquery-on/), você poderá definir manipuladores de eventos para eventos específicos, que acionam a remoção de classes CSS por meio do jQuery.removeClass(). Esse método também pode ser empregado com a mesma facilidade se você usa o [jQuery no WordPress](https://www.ionos.com/pt-br/digitalguide/hospedagem/blogs/wordpress-jquery/ "WordPress e jQuery").

Dica O [*webspace*](https://www.ionos.com/hosting/webspace "Get your project online — IONOS") da IONOS disponibiliza espaço de memória sem anúncios para as suas aplicações web. Os pacotes também incluem domínios e endereços de e-mail personalizados para as necessidades do seu projeto.

## Sintaxe e parâmetros do .removeClass() jQuery

O método jQuery.removeClass() segue a seguinte estrutura básica:

```jQuery
$(selector).removeClass(classname, function(index, currentclass))
```

Aqui, classname indica o nome da(s) classe(s) a serem removida(s). Por sua vez, function(index, currentclass) é a função executada durante a remoção da classe para cada elemento selecionado. O parâmetro index informa o índice do elemento atual, e currentclass especifica o valor atual da classe CSS a ser removida.

Se você tem interesse em aprender mais sobre seletores e sintaxes em jQuery, não deixe de acessar o [tutorial de jQuery para iniciantes](https://www.ionos.com/digitalguide/websites/web-development/jquery-tutorial-introduction-and-first-steps/ "Tutorial de jQuery: Introdução e primeiros passos") do nosso Digital Guide.

Dica Otimize e aumente a eficiência dos seus processos de trabalho com a [API da IONOS para desenvolvedores](https://developer.hosting.ionos.com "IONOS Developer API"). Com ela, você pode criar uma chave de acesso segura para os seus projetos de hospedagem e gerenciar automaticamente os seus recursos.

## Exemplos de uso do .removeClass() jQuery

Os exemplos de códigos que serão apresentados a seguir mostram **três possibilidades de uso** do método jQuery.removeClass().

### jQuery.removeClass() sem parâmetros

```html
<html>
 <head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
   <script>
       $(document).ready(function(){  
     $("#btn").click(function(){
       $("p").removeClass();
     });
       });
   </script>
 </head>
 <body>
   <p class="big-font blue">Example text</p>
   <button id="btn">Click to remove classes</button>
 </body>
</html>
```

Ao inserir o método jQuery.removeClass() **sem argumentos**, você remove todas as classes do elemento correspondente. No exemplo acima, combinamos .removeClass() com a função [jQuery.click()](https://www.ionos.com/pt-br/digitalguide/sites-de-internet/desenvolvimento-web/jquery-click/). Assim, quando se clica no botão com o ID btn, as classes big-font e blue são removidas do elemento &lt;p&gt;.

### Remover classes específicas

Se você deseja remover **classes específicas de uma só vez**, basta indicar essas classes como uma cadeia de caracteres, separando-as por espaços:

```jQuery
$("h1").removeClass("highlight uppercase bold")
```

Ao inserirmos removeClass("highlight uppercase bold"), comandamos a remoção das classes highlight, uppercase e bold do elemento &lt;h1&gt;.

### Usar função como argumento

```jQuery
$(document).ready(function() {
    $("#btn").click(function() {
        $("div#container").removeClass(function() {
            return $(this).attr("class");
        });
    });
});
```

Acima, usamos a função .removeClass() para remover todas as classes CSS do elemento &lt;div&gt; com o ID container, quando se clica no botão com o ID btn. A função .attr("class"), que fornecemos como argumento para removeClass(), retorna o valor atual do atributo de classe do elemento. Assim, todas as classes CSS existentes são removidas do elemento &lt;div&gt;.

Dica Com o [Deploy Now](https://www.ionos.com/hosting/deploy-now "Deploy Now — IONOS") da IONOS, você pode implantar suas aplicações web diretamente pelo GitHub. Configure e publique o seu projeto automaticamente e em poucos passos, e modifique o fluxo de trabalho a qualquer momento. Ainda, URLs de pré-visualização permitem que você execute testes automatizados e receba feedbacks em tempo real.


This is a markdown version of: [https://www.ionos.com/pt-br/digitalguide/sites-de-internet/desenvolvimento-web/removeclass-jquery/](https://www.ionos.com/pt-br/digitalguide/sites-de-internet/desenvolvimento-web/removeclass-jquery/) for AI/LLM consumption.