No Undefined javascript
Every time I try to change the style in javascript it either says I cannot change the property of an undefined variable or null or something like that. here's an example that I want to make the login div visible after clicking on the span1() div but it won't work. what am I doing wrong? Html: <!DOCTYPE html> <html> <head> </head> <body class="body"> <div id="headbar"> <div class="span" onclick="span1()">IUL</div> <div class="span" onclick="span2()">Term</div> <div class="span" onclick="span3()">TaxB</div> <div class="span" onclick="span4()">TOS</div> </div> <div class="login"></div> </body> </html> CSS: .body { background: linear-gradient(130deg,#00f9c3,#00edf9); padding-left: 20px; padding-right: 20px; color:white; font-family: sans-serif; padding:0px 100px 0px 100px; } #headbar { width:100%; height:100px; background-color: azure; border-radius:5px; text-align: center; } .span { background: linear-gradient(130deg,#00f9c3,#00edf9); border-radius:5px; width:100px; height:80px; vertical-align: middle; margin-top: 10px; display:inline-block; } .login { height:300px; width:200px; background-color: white; visibility:hidden; position:absolute; top:200px; right:300px; } JavaScript: function span1(){ document.getElementsByClassName('login').style.visibility="visible"; } Please Help! What am I doing wrong?
Often have questions like this?
Learn more efficiently, for free:
