Selecting property A of an element with property B

Description:

I am selecting multiple inputs with querySelectorAll():

y = x[currentTab].querySelectorAll('#form input[name="fname"], #form input[name="lname"], #form input[name="dname"]');

Iterating over each of the input fields returned by querySelectorAll() and checking if the value of fname and the value of lname or the value of dname are empty:

for (i = 0; i < y.length; i++) {

    if (y[i]."fname".value == "" && y[i]."lname".value == "" || y[i]."dname".value == "") {

      y[i].className += " invalid";

      valid = false;
    }
}

The whole function is as follows:

function validateForm() {

  var x, y, i, valid = true;
  x = document.getElementsByClassName("tab");
  y = x[currentTab].querySelectorAll('#form input[name="fname"], #form input[name="lname"], #form input[name="dname"]');

  for (i = 0; i < y.length; i++) {

    if (y[i]."fname".value == "" && y[i]."lname".value == "" || y[i]."dname".value == "") {

      y[i].className += " invalid";

      valid = false;
    }
  }

  if (valid) {
    document.getElementsByClassName("step")[currentTab].className += " finish";
  }
  return valid;
}

Now in the if statement, I want to say: check if the value of the attribute value of the element with attribute called name that is fname is empty.

Sample input:

<input type="text" class="form-control" name="fname">