title: multiple countdown time in one page
body: <p>first of all , i work with jalali/persian date and countdown jQuery plugins does not work for me. for ex plugins must enter gregorian date like 2017/5/2 but persian/jalali date is 1396/2/17 .</p>
  
  <p>i have muliple datetime with specify day , hour , min and sec . ex:</p>
  
  <p>3 days 13 hour 4min 25 sec</p>
  
  <p>23 days  2hour 41 min 3 sec ...</p>
  
  <p>i have days and hour and min and sec separate,</p>
  
  <p>i want count down for they dates in one page (number of they dates are daynamic)</p>
  
  <p>i use this code and work fine when only have one date in page</p>
  
  <p>html :</p>
  
  <pre><code>  &lt;div class="row"&gt;
  
  @{TimeSpan span = (item.DiscountExpireDate - DateTime.Now);}
  
      &lt;ul class="countdown"&gt;
          &lt;li&gt;
               &lt;span class="seconds"&gt;@span.Seconds&lt;/span&gt;
          &lt;p class="seconds_ref"&gt;ثانیه&lt;/p&gt;
          &lt;/li&gt;
           &lt;li class="seperator"&gt;:&lt;/li&gt;
           &lt;li&gt;
           &lt;span class="minutes"&gt;@span.Minutes&lt;/span&gt;
             &lt;p class="minutes_ref"&gt;دقیقه&lt;/p&gt;
             &lt;/li&gt;
             &lt;li class="seperator"&gt;:&lt;/li&gt;
  
             &lt;li&gt;
            &lt;span class="hours"&gt;@span.Hours&lt;/span&gt;
              &lt;p class="hours_ref"&gt;ساعت&lt;/p&gt;
             &lt;/li&gt;
             &lt;li class="seperator"&gt; &lt;/li&gt;
             &lt;li&gt;
             &lt;span class="days"&gt;@span.Days&lt;/span&gt;
           &lt;p class="days_ref"&gt;روز&lt;/p&gt;
           &lt;/li&gt;
           &lt;/ul&gt;
  
  &lt;/div&gt;
  </code></pre>
  
  <p>and js</p>
  
  <pre><code>&lt;script type="text/javascript"&gt;//for countdown
      $(document)
          .ready(function () {
              var theDaysBox = $(".days");
              var theHoursBox = $(".hours");
              var theMinsBox = $(".minutes");
              var theSecsBox = $(".seconds");
  
                  var refreshId = setInterval(function() {
                          var currentSeconds = theSecsBox.text();
                          var currentMins = theMinsBox.text();
                          var currentHours = theHoursBox.text();
                          var currentDays = theDaysBox.text();
  
                          if (currentSeconds == 0 &amp;&amp; currentMins == 0 &amp;&amp; currentHours == 0 &amp;&amp; currentDays == 0) {
                              // if everything rusn out our timer is done!!
                              // do some exciting code in here when your countdown timer finishes
  
                          } else if (currentSeconds == 0 &amp;&amp; currentMins == 0 &amp;&amp; currentHours == 0) {
                              // if the seconds and minutes and hours run out we subtract 1 day
                              theDaysBox.html(currentDays - 1);
                              theHoursBox.html("23");
                              theMinsBox.html("59");
                              theSecsBox.html("59");
                          } else if (currentSeconds == 0 &amp;&amp; currentMins == 0) {
                              // if the seconds and minutes run out we need to subtract 1 hour
                              theHoursBox.html(currentHours - 1);
                              theMinsBox.html("59");
                              theSecsBox.html("59");
                          } else if (currentSeconds == 0) {
                              // if the seconds run out we need to subtract 1 minute
                              theMinsBox.html(currentMins - 1);
                              theSecsBox.html("59");
                          } else {
                              theSecsBox.html(currentSeconds - 1);
                          }
                      },
                      1000);
  
         });
  &lt;/script&gt;
  </code></pre>
  
  <p>but when i have multiple dates on page does not work well , and it seems that numbers are sum together.</p>
  
  <p><a href="https://jsfiddle.net/a7ucv468/1/" rel="nofollow noreferrer">https://jsfiddle.net/a7ucv468/1/</a></p>
  
  <p>anyone can help me ?</p>