title: How do I split the date and time into two elements?
body: <p>I've made an object that displays the date and time live.</p>
  
  <p>I would like to know how I can separate the time part from the date so I can have it in its own HTML element so I can apply different styling to it?</p>
  
  <p>I'm not that advanced with JavaScript, and I find working with the date object very complicated.</p>
  
  <p><strong>LiveDateTime.js</strong></p>
  
  <pre><code>'use strict';
  
  function LiveDateTime(dateEl, options) {
      this.dateEl = dateEl;
      this.options = options;
  
      this.timestamp;
      this.offset;
  
      this.start();
  }
  
  LiveDateTime.prototype = {
      start: function () {
          var now = !this.timestamp ? new Date() : new Date(this.timestamp),
              self = this;
  
          (function update() {
              self.dateEl.innerHTML = now.toLocaleString(self.options.locale, self.options);
  
              now.setSeconds(now.getSeconds() + 1);
  
              self.timeoutId = setTimeout(update, 1000);
          })();
      },
  
      stop: function () {
          clearTimeout(this.timeoutId);
  
          this.timeoutId = undefined;
      }
  };
  </code></pre>
  
  <p><strong>Usage</strong></p>
  
  <pre><code>var liveDateTime = new LiveDateTime(document.getElementById('date'), {
      locale: 'FR',
      weekday: 'long',
      day: 'numeric',
      month: 'long',
      year: 'numeric',
      hour: '2-digit',
      minute: '2-digit',
      second: '2-digit'
  });
  
  //output example: vendredi 13 mars 2015 23:14:12 
  </code></pre>
  
  <p><strong>HTML</strong></p>
  
  <pre><code>&lt;span id="date"&gt;&lt;/span&gt; - &lt;span id="time"&gt;&lt;/span&gt;
  </code></pre>