javascript - Making divs visible and invisible with 1 button without JQUERYand an error if not correctly filled in textfields -

im working on little project.

here fiddle: http://jsfiddle.net/gjf46/

i need invisible button make 3 divs invisible when clicked , visible again when clicked. tried doing this:

var gone = document.getelementbyid("invisible"); var div1 = document.getelementbyid("one"); var div2 = document.getelementbyid("two"); var div3 = document.getelementbyid("three"); gone.addeventlistener("click", function () {     if (     div1.style.visibility == "visible",     div2.style.visibility == "visible",     div3.style.visibility == "visible") {         div1.style.visibility == "hidden";         div2.style.visibility == "hidden";         div3.style.visibility == "hidden";     } else {         div1.style.visibility == "visible";         div2.style.visibility == "visible";         div3.style.visibility == "visible";     } }); 

also need alert box when textfields not filled in correctly. should accept values set example. got no clue how that, im new javascript.

i want without jquery.

you accidentally wrote == (equality comparison) instead of = (assignment). corrected code can tested here.

weg.addeventlistener("click", function () {     if (     div1.style.visibility !== "hidden",     div2.style.visibility !== "hidden",     div3.style.visibility !== "hidden") {         div1.style.visibility = "hidden";         div2.style.visibility = "hidden";         div3.style.visibility = "hidden";     } else {         div1.style.visibility = "";         div2.style.visibility = "";         div3.style.visibility = "";     } }); 

i utilized fact default visibility "visible" (source). note explicitly check whether visibility "hidden". important: visibility empty string initially, testing whether "visible" leads button doesn't work first time clicked. 1 solve writing div1.style.visibility === "visible" || div1.style.visibility === "" etc., above version shorter.

---

the code can made bit cleaner if introduce state variable (the test here):

var divsarevisible = true; weg.addeventlistener("click", function () {     if (divsarevisible) {         div1.style.visibility = "hidden";         div2.style.visibility = "hidden";         div3.style.visibility = "hidden";     } else {         div1.style.visibility = "";         div2.style.visibility = "";         div3.style.visibility = "";     }     divsarevisible = !divsarevisible; });