Home/ Questions/Q 4007572
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-20T08:38:55+00:00

Please have a look on code written below. I am trying to have a

  • 0

Please have a look on code written below. I am trying to have a multiple timer on one page:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
     "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8">
<link rel="stylesheet" href="jquery.countdown.css" media="all" type="text/css" />

    <style type="text/css">
    #defaultCountdown { width: 240px; height: 40px; }
    </style>

    <script type="text/javascript" src="jquery-1.3.2.js"></script>
      <script type="text/javascript" src="jquery.countdown.js"></script>
      <script language="javascript" type="text/javascript"> 

      function LoadText()
      {  
      document.getElementById('dd').innerHTML = '<div id=\"defaultCountdown\" class=\"countdown\" rel=\"87401\">hjhg</div><br/><div id=\"defaultCountdown\" class=\"countdown\" rel=\"60\">hjgj</div><br/><div id=\"defaultCountdown\" class=\"countdown\" rel=\"1800\">hjhg</div><br/>';  
      } 
         </script> 

    </head>
    <body>
    <div id="dd">
    </div>


     <script type="text/javascript">
          // Initialization 
      $(document).ready(function()
      {  

           var date = new Date();       
           $('div.#defaultCountdown').each(function()
            {             

               $(this).countdown
               ({
               until:parseInt($(this).attr("rel"),10),
               format:"DHMS",          
               expiryText:"Expired"
                })
            })   
        });      

         </script>
    </body>
    </html>

My code works fine when I create Divs Hardcoded. But when I load it through Ajax (For understanding of code, for the time being I am creating Divs using Function LoadText()), I am not able to get it displayed. Please help me out.

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    You should be using a class or unique IDs for the #defaultCountdown div.

    Also this would confuse the selector engine since you are telling it to look for a class with a # sign in it:

    $('div.#defaultCountdown').each(function()

    Try changing it to a class and use:

    $('div.defaultCountdown').each(function()

    Update: Ok, the reason why your code isn’t working is because the LoadText() function is never called. If you update your script to look like this, it will work (demo):

    $(document).ready(function() {

    // This is needed to simulate the ajax call
    LoadText();

    // set up countdown timers
    var date = new Date();
    $('div.countdown').each(function() {
        $(this).countdown({
            until: parseInt($(this).attr("rel"), 10),
            format: "DHMS",
            expiryText: "Expired"
        });
    });
});
    • 0