Why isn't this working? Help appreciated :D

[J04h]

Thanks in advance for taking a look at this, I'm a beginner at this. If I were to replace function(){ document.getElementById("stsbutton").innerHTML="<input id="saveForm" class="button_text" type="submit" name="submit" value="Submit"/>";} with something else like an alert() it works 3 seconds after loading the page, otherwise nothing happens.

What I currently have (red&bold code does not work):

<script type="text/javascript">
var myCounter = new Countdown({  
    seconds:3,  // number of seconds to count down
    onUpdateStatus: function(sec){console.log(sec);}, // callback for each second
    onCounterEnd: function(){ document.getElementById("stsbutton").innerHTML="<input id="saveForm" class="button_text" type="submit" name="submit" value="Submit"/>";}
});

myCounter.start();

function Countdown(options) {
  var timer,
  instance = this,
  seconds = options.seconds || 10,
  updateStatus = options.onUpdateStatus || function () {},
  counterEnd = options.onCounterEnd || function () {};

  function decrementCounter() {
    updateStatus(seconds);
    if (seconds === 0) {
      counterEnd();
      instance.stop();
    }
    seconds--;
  }

  this.start = function () {
    clearInterval(timer);
    timer = 0;
    seconds = options.seconds;
    timer = setInterval(decrementCounter, 1000);
  };

  this.stop = function () {
    clearInterval(timer);
  };
}

function SetButtonStatus(sender, target)
{

if ( sender.value.length >= 12 )
document.getElementById(target).disabled = false;

else

document.getElementById(target).disabled = true;
}

</script>

<script type="text/javascript">
var myCounter = new Countdown({  
    seconds:2,  // number of seconds to count down
    onUpdateStatus: function(sec){console.log(sec);}, // callback for each second
    onCounterEnd: function(){ document.getElementById("stsbutton").innerHTML="<input id="saveForm" class="button_text" type="submit" name="submit" value="Submit"/>";}
});

myCounter.start();

function Countdown(options) {
  var timer,
  instance = this,
  seconds = options.seconds || 10,
  updateStatus = options.onUpdateStatus || function () {},
  counterEnd = options.onCounterEnd || function () {};

  function decrementCounter() {
    updateStatus(seconds);
    if (seconds === 0) {
      counterEnd();
      instance.stop();
    }
    seconds--;
  }

  this.start = function () {
    clearInterval(timer);
    timer = 0;
    seconds = options.seconds;
    timer = setInterval(decrementCounter, 1000);
  };

  this.stop = function () {
    clearInterval(timer);
  };
}

function SetButtonStatus(sender, target)
{

if ( sender.value.length >= 12 )
document.getElementById(target).disabled = false;

else

document.getElementById(target).disabled = true;
}

</script>

<div id="stsbutton"><b>Submit</b> button will be available in <b>3</b> seconds...</div>

[niralsoni]

Are you sure the syntax is correct ? From the code you have given here -

onCounterEnd: function(){ document.getElementById("stsbutton").innerHTML="<input id="saveForm" class="button_text" type="submit" name="submit" value="Submit"/>";}

it seems that there is error in the usage of quotes. The correction will be as given below -

onCounterEnd: function(){ document.getElementById("stsbutton").innerHTML='<input id="saveForm" class="button_text" type="submit" name="submit" value="Submit"/>';}

[AndrewGSW]

Also, from the code you have shown then (apart from the duplication) your code runs before "stsbutton" exists on the page. Put your scripts at the end of the page (before the closing body-tag) or wait until the page has finished loading:

window.onload = some_function;