Foros del Web - Ver Mensaje Individual - como puedo cambiar la clase en todos los div con javascript

emprear · #15 (**permalink**) 18/12/2011, 18:38

La función cambia cualquier elemento que tenga la clase .uno, asignándole la clase .nuevocolor (esta última tine que estar en tu css)

Código HTML:

Ver original<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Cambiar estilo en clases</title> 
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<style type="text/css">
/*<![CDATA[*/
.uno {
color: blue;
}
.nuevocolor {
color: green;
}
/*]]>*/
</style>
<script type="text/javascript">
//<![CDATA[
function procesarSelector(){
[].slice.call(document.querySelectorAll('.uno')).forEach(function(elemento){ 
    elemento.className += ' nuevocolor'; 
});
}
//]]>
</script>
</head>
<body>
<div class="uno">
Texto 1
</div>
<div class="dos">
Texto 2
</div>
<div class="uno">
Texto 3
</div>
<div class="dos">
Texto 4
</div>
<p class="uno">
Texto 5 (en un párrafo)
</p>
<p>
<button onclick="procesarSelector();">buscar tags con class uno y cambiar el color</button>
</p> 
</body>
</html>

Podrías hacer que cambie todos las etiquetas "div", pero es má flexible si le das una clase específica a los elementos que querés cambiar.

Saludos