Ajuda

Olá, tudo bem?!

É o seguinte, quero que ele só fique em vermelho o imc quando der algum resultado inválido.Até esse ponto eu consegui.

O problema que está ocorrendo é que quando da algum valor incorreto ele só põe de vermelho o primeiro imc.

o código do instrutor é o seguinte:

var pacientes = document.querySelectorAll(".paciente");

for (var i = 0; i < pacientes.length; i++) {
  var paciente = pacientes[i];

  var tdPeso = paciente.querySelector(".info-peso");
  var peso =  tdPeso.textContent;

  var tdAltura = paciente.querySelector(".info-altura");
  var altura = tdAltura.textContent;

  var tdImc = paciente.querySelector(".info-imc");

  var alturaEValida = true;
  var pesoEValido = true;

  if (peso <= 0 || peso > 1000) {
    tdImc.textContent = "Peso inválido!"
    pesoEValido = false;
    paciente.classList.add("paciente-invalido");
  }

  if (altura <= 0 || altura > 1000) {
      tdImc.textContent = "Altura inválida!";
      alturaEValida = false;
      paciente.classList.add("paciente-invalido");
  }

  if (pesoEValido && alturaEValida) {
    var imc = peso / (altura * altura);
    tdImc.textContent = imc.toFixed(1);

  }
}

Ao fazer esse código se algum peso, ou altura não estiver nos conformes, seleciona toda a linha, nome, peso, atura,etc. E à pinta de vermelho.

sabendo disso fiz mais específico, criei meu código assim:

var pacientes = document.querySelectorAll(".paciente");
var invalido = document.querySelector(".info-imc");

for (var i = 0; i < pacientes.length; i++) {
  var paciente = pacientes[i];

  var tdPeso = paciente.querySelector(".info-peso");
  var peso =  tdPeso.textContent;

  var tdAltura = paciente.querySelector(".info-altura");
  var altura = tdAltura.textContent;

  var tdImc = paciente.querySelector(".info-imc");

  var alturaEValida = true;
  var pesoEValido = true;

  if (peso <= 0 || peso > 1000) {
    tdImc.textContent = "Peso inválido!"
    pesoEValido = false;
    invalido.classList.add("paciente-invalido");
  }

  if (altura <= 0 || altura > 1000) {
      tdImc.textContent = "Altura inválida!";
      alturaEValida = false;
      invalido.classList.add("paciente-invalido");
  }

  if (pesoEValido && alturaEValida) {
    var imc = peso / (altura * altura);
    tdImc.textContent = imc.toFixed(1);

  }
}

com esse código acima, só coloca de vermelho o primeiro Imc, independente se é a altura ou o peso errado, ou ainda se é o ultimo paciente ao invés do primeiro.

Pensei em fazer um for para ele ir de paciente em paciente conferindo, não deu certo. Pelo menos o método que tentei.

Poderiam me ajudar?