Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

145
Vistas
I want to get the ID of the first input with a green color within inputs array and then change the color of that input by its ID

I want to get input ID here and use it to change input color to be grey. Then repeat the process for other inputs with green color

var getGreenColor = document.getElementsByClassName("my_inputs")[0].style.color;

if (getGreenColor == "green") {
  console.log("green")
}
else console.log(getGreenColor)
<input type="text" style="color: green;" id="1" class="my_inputs" value="stuff">
<input type="text" style="color: green;" id="2" class="my_inputs" value="stuff">
<input type="text" style="color: green;" id="3" class="my_inputs" value="stuff">
<input type="text" style="color: green;" id="4" class="my_inputs" value="stuff">

about 4 years ago · Juan Pablo Isaza
3 Respuestas
Responde la pregunta

0

So from what I understand, you want to change all inputs with green color text to grey. If that were the case, you would want to get the elements in question by doing the following:

var greenInputsArray = document.getElementsByClassName("my_inputs");

And then you could loop through the array and if the color is green, you can change the color to grey as follows:

for (var i = 0; i < greenInputsArray.length; i++) {
    if(greenInputsArray[i].style.color == "green") {
       greenInputsArray[i].style.color = "grey";
    }
}
about 4 years ago · Juan Pablo Isaza Denunciar

0

You need the style.color or getComputedStyle

The style.color is undefined if not inline

const getColor = ele => ele.style.color || window.getComputedStyle(ele).color;

document.querySelectorAll(".my_inputs").forEach((ele,i) => {
  const color = getColor(ele);
  console.log(i,color)
  if (color === "green" || color === "rgb(0, 128, 0)") {
    ele.style.color = "grey"
  }
})
#id1 {
  color: green;
}
<input type="text" style="color: green;" id="id2" class="my_inputs" value="stuff" />
<input type="text" id="id1" class="my_inputs" value="stuff">
<input type="text" style="color: green;" id="id3" class="my_inputs" value="stuff">
<input type="text" style="color: red;" id="id4" class="my_inputs" value="stuff">
<input type="text" style="color: green;" id="id5" class="my_inputs" value="stuff">

about 4 years ago · Juan Pablo Isaza Denunciar

0

Just use

var elements = document.getElementsByClassName('my_inputs');
for (let a=0; a < elements.length; a++) {
    if (elements[a].style.color == 'green') {
        elements[a].style.color = 'grey';
    }
}

This will loop through the elements and if it is green, turn it to grey.

about 4 years ago · Juan Pablo Isaza Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda