php - document.getElementById is NULL error -

i have function listens onkeyup event, onkeyup checks see if box has value , if not blank supposed pull value of elementid phone number called page. takes value , inserts in snippet of html gets sent elementid. folowing code function , associated code.

<script language="javascript"> function monthlycheck() {      var mnthchk = document.getelementbyid("mdamountbox");     var cancelphone = document.getelementbyid("cancelphonelabel");     document.getelementbyid("cancelphonelistlabel").value = cancelphone; <--gives null error      if(mnthchk.value!=""){          var newhtml = "<span style='color:#24d330'> monthly pledge in amount of $__ valid , deducted time every month<br> untill notify of cancellation calling <label id='cancelphonelistlabel'>&nbsp;</label>";         " </span>";          document.getelementbyid("mnthlychkdiscolabel").innerhtml = newhtml;     } }  </script>  <label id="mnthlychkdiscolabel">&nbsp;</label> <---this final data displayed <label id="cancelphonelabel">1-800-555-1111</label> <--- phone number pulled page, 

all data pulled in single page when loaded written in separate page using smarty templates. keep getting entitled error , have tried number of different things fix im stumped appreciated.

here jfiddle http://jsfiddle.net/rn5hh/

i think trying access id before it's created. .value inputs. looks creating label, you'd use innerhtml instead.

something this:

<script language="javascript"> function monthlycheck() {    var mnthchk = document.getelementbyid("mdamountbox");   var cancelphone = document.getelementbyid("cancelphonelabel");    if(mnthchk.value!=""){      var newhtml = "<span style='color:#24d330'> monthly pledge in amount of $__ valid , deducted time every month<br> untill notify of cancellation calling <label id='cancelphonelistlabel'>&nbsp;</label></span>";      document.getelementbyid("mnthlychkdiscolabel").innerhtml = newhtml;      document.getelementbyid("cancelphonelistlabel").innerhtml = cancelphone; //<--gives null error    } } </script>  <label id="mnthlychkdiscolabel">&nbsp;</label> <---this final data displayed  <label id="cancelphonelabel">1-800-555-1111</label> <--- phone number pulled page, 

i'm not 100% trying do, tried make work. there many things simplify in this. if create jsfiddle show more clearly.

edit:

fixed fiddle works , shows phone number: updated fiddle

is it's supposed do?