javascript - Why doesn't my submit button hide? -

background: have form on single page several div's start out first div showing , others hidden. make selection, next form div dynamically built , displayed based on choices in previous div. previous form divs still displayed. progressively end more of form fields showing progress through choices. have not put whole code here brevity.

i using javascript this. not using jquery intentionally still working on being comfortable in javascript before start relying on library.

my problem: want hide submit button @ end of form until last form div revealed. trying not working , i've exhausted things have found on web. should simple, apparently must special submit button not in javascript knowledge yet.

what i've done: below think should work, not (i have kept code limited issue @ hand, if thinks deeper happily edit , add more code). onclick() function working otherdiv. i.e. when click on 2nd last div, otherdiv displayed expected. should reveal submit button, not (and submit button not hidden in first place).

the problem simple whatever reason, submit button not given style of "none" on page load , not give style of "block" when onclick() event happens.

i see in console below error shows when use getelemntsbyname target submit button shown below, not sure why getting it. understand error, not why targeting of submit button getelementsbyname throwing error.

i have tried targeting submit button id getelementbyid , while console error below goes away then, still not submit button hidden.

i have shown code below getelementsbyname error because want understand error solving hidden submit button problem.

console

typeerror: pdfbutton.style undefined if(pdfbutton) {pdfbutton.style.display = 'none'}; 

html

<form id="buildshopdrawing" name="buildshopdrawing" method="post" action="<?php echo $_server['php_self']; ?>">     <input type="submit" name="buildpdf" id="buildpdf" class="buildpdfbutton" value="build shop drawings pdf">     </form> 

javascript

    function preparepage() {          // set common divs var ease of use         var pdfbutton = document.getelementsbyname('buildpdf');        // hide: submit button until last form revealed           (var = 0; < door.length; i++) {         door[i].onclick = function() {           if(this.checked) {             otherdiv.style.display = 'block';             pdfbutton.style.display = 'block';           }         };      };        //hide form divs on initial page load      if(pdfbutton) {pdfbutton.style.display = 'none'};      } //end preparepage  // not execute javascript until page loaded window.onload =  function() { preparepage(); }; 

as always, appreciated!

you have typo. id="buildpdf" != ('buildpdf')

(and others pointed out, use getelementbyid)