Changing <td> background in IE not working, but does in FF

[philcro]

Here's my code:

// Mouse on click cell
      function CellOnClick(c) {
        if (document.getElementById("box"+c+"cell").style.backgroundColor == "rgb(141, 255, 0)" || document.getElementById("box"+c+"cell").style.backgroundColor == "#8DFF00") {
          document.getElementById("box"+c+"cell").style.backgroundColor = "#CAFF89";

          sMonth = document.getElementById("month").innerHTML.replace(/January/, "1");
          sMonth = sMonth.replace(/February/gi, "2");
          sMonth = sMonth.replace(/March/gi, "3");
          sMonth = sMonth.replace(/April/gi, "4");
          sMonth = sMonth.replace(/May/gi, "5");
          sMonth = sMonth.replace(/June/gi, "6");
          sMonth = sMonth.replace(/July/gi, "7");
          sMonth = sMonth.replace(/August/gi, "8");
          sMonth = sMonth.replace(/September/gi, "9");
          sMonth = sMonth.replace(/October/gi, "10");
          sMonth = sMonth.replace(/November/gi, "11");
          sMonth = sMonth.replace(/December/gi, "12");
          sDay = document.getElementById("box"+c+"day").innerHTML.replace(/January/, "1");
          sDay = sDay.replace(/February/gi, "2");
          sDay = sDay.replace(/March/gi, "3");
          sDay = sDay.replace(/April/gi, "4");
          sDay = sDay.replace(/May/gi, "5");
          sDay = sDay.replace(/June/gi, "6");
          sDay = sDay.replace(/July/gi, "7");
          sDay = sDay.replace(/August/gi, "8");
          sDay = sDay.replace(/September/gi, "9");
          sDay = sDay.replace(/October/gi, "10");
          sDay = sDay.replace(/November/gi, "11");
          sDay = sDay.replace(/December/gi, "12");

          if (sMonth.length == 1) { sMonth = "0" + sMonth; }
          if (sDay.length == 1) { sDay = "0" + sDay; }

          selected.push(document.getElementById("year").innerHTML + "." + sMonth + "." + sDay);
        }
        else if (document.getElementById("box"+c+"cell").style.backgroundColor == "rgb(202, 255, 137)") {
          document.getElementById("box"+c+"cell").style.backgroundColor = "#8DFF00";
          str = document.getElementById("year").innerHTML + "." + document.getElementById("month").innerHTML + "." + document.getElementById("box"+c+"day").innerHTML;
          pos = selected.indexOf(str);
          selected.splice(pos, 1);
        }
        if (selected.length != 0) {
          document.getElementById("dirbutton").innerHTML = "<input type=\"button\" value=\"CONTINUE\" onmousedown=\"clickContinue()\">";
        }
        else {
          document.getElementById("dirbutton").innerHTML = "";
        }
      }

I can click on a table cell in FF and it changes the color. In IE, it doesn't do anything. The function is getting called, but then the first if statement isn't catching it in IE.

[Logic Ali]

Then the first thing to do is alert the value as the first statement in the function:

alert( document.getElementById("box"+c+"cell").style.backgroundColor );

There are less fragile ways of implementing this functionality.

[WolfShade]

If the JavaScript is breaking in IE, there is usually a small, yellow exclamation point in the lower-left corner of the IE browser. If you double-click it, it will display all JavaScript errors.

[Troy III]

else if (document.getElementById("box"+c+"cell").style.backgroundColor == "rgb(202, 255, 137)" || [missing]) {