En este artículo, eliminaremos todas las clases CSS de un elemento mediante jQuery. Para eliminar todas las clases CSS de un elemento, usamos el método removeClass().
El método removeClass() se usa para eliminar uno o más nombres de clase del elemento seleccionado.
Sintaxis:
$(selector).removeClass(class_name, function(index, class_name))
Parámetros: esta función acepta dos parámetros, como se mencionó anteriormente y se describe a continuación:
- class_name: es un parámetro opcional que se usa para especificar el nombre de la clase (una o más clases) para eliminar. Múltiples nombres de clases separados por espacios.
- función: es un parámetro opcional y devuelve uno o más nombres de clase que deben eliminarse.
- índice: este parámetro se utiliza para devolver el índice del elemento.
- current_class_name: este parámetro devuelve el nombre de clase de los elementos seleccionados.
Ejemplo:
HTML
<!DOCTYPE html> <html lang="en"> <head> <title> How to remove all CSS classes using jQuery? </title> <style> .GFG1 { color: green; } .GFG2 { font-size: 30px; font-weight: bold; } </style> <!-- Import jQuery cdn library --> <script src= "https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"> </script> <script> $(document).ready(function () { $("button").click(function () { $("p").removeClass(); }); }); </script> </head> <body style="text-align: center;"> <h1 style="color: green;"> GeeksforGeeks </h1> <h3> How to remove all CSS classes using jQuery? </h3> <p class="GFG1 GFG2"> Computer Science Portal </p> <button>Click Here!</button> </body> </html>
Producción:
Antes de hacer clic en el botón:
Después de hacer clic en el botón: