It would appear as though javascript will only read the value of CSS instructions if they were written by javascript.
For example, let’s say you have:

CSS
div#doNotShow {display: none}

Javascript
function toggle(divId) {
var e = document.getElementById(divId);
if(e.style.display != 'none')
e.style.display = 'none';
else
e.style.display = 'block';
}

You will need to click twice (not double-click) to show it the first time. After that it will respond as you expected. It’s like this because the first time you click, you’re setting the display property to none in js. Thereafter, it has explicit js-set styles to work with and will respond the way you want. On refresh, of course, you’re back to square one.

I’m sure a universal toggle function can be written (using more lines of code, and getComputedStyle or similar), but this suits my needs. Two functions: one to showHide hidden elements; and one to hideShow visibles.

function showHide(divId) {
document.getElementById(divId).style.display = (document.getElementById(divId).style.display == "block") ? "" : "block";
}
function hideShow(divId) {
document.getElementById(divId).style.display = (document.getElementById(divId).style.display == "none") ? "" : "none";
}