title: Change image at certain times of day using jQuery
body: <p>I've looked around and cobbled together a script that will change an image on a WordPress site depending whether it is morning, day or evening.</p>
  
  <p>A morning image shows between the hours of 5am and 12 noon.<br>
  A day image shows between the hours of 12 noon and 9pm.<br>
  A night image shows if the time is neither of them.</p>
  
  <p>I am stuck on two things.</p>
  
  <p>1) Currently for any time starting 12:xx the evening images shows rather than the day one. Then at 13 the day one shows. How I do I make it so that bang on 12 noon the images change?</p>
  
  <p>2) How do I set the code to run every 60 seconds? Currently if a time change occurs the correct image doesn't display unless you refresh / reload</p>
  
  <pre><code>(function($) {
      "use strict";
      $(document).ready(function(){
          var day_night = new Date().getHours();{
          if (day_night &gt; 5 &amp;&amp; day_night &lt; 12){
              document.getElementById("gilidimage").style.backgroundImage = "url('http://morning-image-here.png')";
          } else
              if (day_night &gt; 12 &amp;&amp; day_night &lt; 21){
                  document.getElementById("gilidimage").style.backgroundImage = "url('http://day-image-here.png')";
              }
              else {
                  document.getElementById("gilidimage").style.backgroundImage = "url('http://night-image-here.png')";
              }
          }
      });
  }(jQuery));
  </code></pre>
  
  <p>My first ever post / question so be honest but not brutal :)</p>
  
  <p>Thanks</p>
  
  <p>Tim</p>