How to show / hide multiple elements at the same time with javascript

Question

So, I have this between my head tags

Answer 1

Your JS should be setting the div's display to "block" ("visible" isn't a valid value for display).

Also, from the looks of things your elements aren't in the DOM at the time the code is fired (your code doesn't see them yet). Do any of the following:

Place your code anywhere in the document body below the divs

or, use an unobtrusive strategy to fire your function on window load, a la:

function addLoadEvent(func) {
  var oldonload = window.onload;
  if (typeof window.onload != 'function') {
    window.onload = func;
  } else {
    window.onload = function() {
      if (oldonload) {
        oldonload();
      }
      func();
    }
  }
}

addLoadEvent(nameOfSomeFunctionToRunOnPageLoad);

or, Use a JS framework's "ready" functionality, a la jQuery's:

$(function () {
    nameOfSomeFunctionToRunOnPageLoad();
});