My program is skipping the if part and running the else part instead, can someone please help me?

This is my javascript code. I do not know why, but it directly displays the else part and skips the if statement. I even used alerts. The alert worked under the else part, but would not work under the if part. I am a beginner and I do not know what I am doing wrong. Can someone please help me?

var teacherDetails;
var teacherGrades;
var teacherGenders;
var teacherClubs;
var teacherClasses;
var studentGrades;
var studentGenders;
var studentClubs;
var studentClasses;
var counter;
var textHolder = " ";

function displayAnnouncement(){
  teacherDetails=localStorage.getItem("teacherDetailsKey");
  teacherGrades=localStorage.getItem("teacherGradesKey");
  teacherGenders=localStorage.getItem("teacherGendersKey");
  teacherClubs=localStorage.getItem("teacherClubsKey");
  teacherClasses=localStorage.getItem("teacherClassesKey");
  studentGrades=localStorage.getItem("studentGradesKey");
  studentGenders=localStorage.getItem("studentGendersKey");
  studentClubs=localStorage.getItem("studentClubsKey");
  studentClasses=localStorage.getItem("studentClassesKey");

  for(counter = 0; counter < teacherDetails.length; counter++){
    if((teacherGrades[counter]==studentGrades||teacherGrades[counter]=="All")&&
    (teacherGenders[counter]==studentGenders||teacherGenders[counter]=="All")&&
    (teacherClubs[counter]==studentClubs||teacherClubs[counter]=="All")&&
    (teacherClasses[counter]==studentClasses||teacherClasses[counter]=="All")){
      //document.getElementById("htmlTAnnouncement").innerHTML=teacherDetails;
      textHolder += teacherDetails[counter];
    }else{
      textHolder="Sorry, there are no announcements";
    }
  }
  document.getElementById("htmlTAnnouncement").innerHTML=textHolder;
}