The Final Countdown is not functioning

Question

The Final Countdown is not appearing on my page when i open it in Google Chrome. I'm not quite sure why the countdown does not function. Can someone please help me out here? Thanks a lot!

<!DOCTYPE html>
<html>
<head>
    <title>The Final Countdown</title>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
    <script type="text/javascript" src="jquery.countdown.min.js"></script>
    <script type="text/javascript">
        $('#getting-started').countdown('2016/01/01', function(event) {
            $(this).html(event.strftime('%w weeks %d days %H:%M:%S'));
        });
    </script>
</head>
<body>
    <div id="getting-started"></div>
</body>
</html>

Or move the script tags (all or at least the last one) at the bottom of the page. right before the closing `
` tag — Andreas, Oct 15 '15 at 08:45

score 1 · Answer 1 · answered Oct 15 '15 at 08:45

1

You need to execute your code once the DOM is ready. You can do this by putting it in a DOMReady handler:

$(function() {
    $('#getting-started').countdown('2016/01/01', function(event) {
        $(this).html(event.strftime('%w weeks %d days %H:%M:%S'));
    });
});

At the moment you're calling the countdown() method on the #getting-started element before it exists in the DOM.

answered Oct 15 '15 at 08:45

Rory McCrossan

331,213
40
305
339

Thank you very much!! i'm still an amateur, but thanks a lot Rory!! – B.Liu Oct 15 '15 at 08:47
No problem, glad to help – Rory McCrossan Oct 15 '15 at 08:47

The Final Countdown is not functioning

1 Answers1