title: How to change date format in jQuery?
body: <p>I just want to change date format on my website. Actually currently I am getting result like this: (Thu Mar 14 2013) and I want to change it like this: (2013-03-14)
  Please help</p>
  
  <p>My Code is:
  <strong>On HTML</strong></p>
  
  <pre><code>&lt;input type="text" id="date_from" name="date_from" &gt;
  
  var picker = new Pikaday(
  {
      field: document.getElementById('date_from'),
      firstDay: 1,
      yearRange: [2013,2015],
  
  });
  
  var picker = new Pikaday(
  {
      field: document.getElementById('date_to'),
      firstDay: 1,
      yearRange: [2013,2015],
  
  });
  </code></pre>
  
  <p><strong>End HTML</strong></p>
  
  <p><strong>Include File (pikaday.js)</strong></p>
  
  <pre><code>(function(window, document, undefined)
  {
  'use strict';
  
  /**
   * feature detection and helper functions
   */
  var hasMoment = typeof window.moment === 'function',
  
  hasEventListeners = !!window.addEventListener,
  
  sto = window.setTimeout,
  
  addEvent = function(el, e, callback, capture)
  {
      if (hasEventListeners) {
          el.addEventListener(e, callback, !!capture);
      } else {
          el.attachEvent('on' + e, callback);
      }
  },
  
  removeEvent = function(el, e, callback, capture)
  {
      if (hasEventListeners) {
          el.removeEventListener(e, callback, !!capture);
      } else {
          el.detachEvent('on' + e, callback);
      }
  },
  
  fireEvent = function(el, eventName, data)
  {
      var ev;
  
      if (document.createEvent) {
          ev = document.createEvent('HTMLEvents');
          ev.initEvent(eventName, true, false);
          ev = extend(ev, data);
          el.dispatchEvent(ev);
      } else if (document.createEventObject) {
          ev = document.createEventObject();
          ev = extend(ev, data);
          el.fireEvent('on' + eventName, ev);
      }
  },
  
  trim = function(str)
  {
      return str.trim ? str.trim() : str.replace(/^\s+|\s+$/g,'');
  },
  
  hasClass = function(el, cn)
  {
      return (' ' + el.className + ' ').indexOf(' ' + cn + ' ') !== -1;
  },
  
  addClass = function(el, cn)
  {
      if (!hasClass(el, cn)) {
          el.className = (el.className === '') ? cn : el.className + ' ' + cn;
      }
  },
  
  removeClass = function(el, cn)
  {
      el.className = trim((' ' + el.className + ' ').replace(' ' + cn + ' ', ' '));
  },
  
  isArray = function(obj)
  {
      return (/Array/).test(Object.prototype.toString.call(obj));
  },
  
  isDate = function(obj)
  {
      return (/Date/).test(Object.prototype.toString.call(obj)) &amp;&amp; !isNaN(obj.getTime());
  },
  
  isLeapYear = function(year)
  {
      // solution by Matti Virkkunen: http://stackoverflow.com/a/4881951
      return year % 4 === 0 &amp;&amp; year % 100 !== 0 || year % 400 === 0;
  },
  
  getDaysInMonth = function(year, month)
  {
      return [31, isLeapYear(year) ? 29 : 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31][month];
  },
  
  setToStartOfDay = function(date)
  {
      if (isDate(date)) date.setHours(0,0,0,0);
  },
  
  compareDates = function(a,b)
  {
      // weak date comparison (use setToStartOfDay(date) to ensure correct result)
      return a.getTime() === b.getTime();
  },
  
  extend = function(to, from, overwrite)
  {
      var prop, hasProp;
      for (prop in from) {
          hasProp = to[prop] !== undefined;
          if (hasProp &amp;&amp; typeof from[prop] === 'object' &amp;&amp; from[prop].nodeName === undefined) {
              if (isDate(from[prop])) {
                  if (overwrite) {
                      to[prop] = new Date(from[prop].getTime());
                  }
              }
              else if (isArray(from[prop])) {
                  if (overwrite) {
                      to[prop] = from[prop].slice(0);
                  }
              } else {
                  to[prop] = extend({}, from[prop], overwrite);
              }
          } else if (overwrite || !hasProp) {
              to[prop] = from[prop];
          }
      }
      return to;
  },
  
  
  /**
   * defaults and localisation
   */
  defaults = {
  
      // bind the picker to a form field
      field: null,
  
      // automatically show/hide the picker on `field` focus (default `true` if `field` is set)
      bound: undefined,
  
      // the default output format for `.toString()` and `field` value
      format: 'YYYY-MM-DD',
  
      // the initial date to view when first opened
      defaultDate: null,
  
      // make the `defaultDate` the initial selected value
      setDefaultDate: false,
  
      // first day of week (0: Sunday, 1: Monday etc)
      firstDay: 0,
  
      // the minimum/earliest date that can be selected
      minDate: null,
      // the maximum/latest date that can be selected
      maxDate: null,
  
      // number of years either side, or array of upper/lower range
      yearRange: 10,
  
      // used internally (don't config outside)
      minYear: 0,
      maxYear: 9999,
      minMonth: undefined,
      maxMonth: undefined,
  
  
      isRTL: false,
  
      // how many months are visible (not implemented yet)
      numberOfMonths: 1,
  
      // internationalization
      i18n: {
          previousMonth : 'Previous Month',
          nextMonth     : 'Next Month',
          months        : ['January','February','March','April','May','June','July','August','September','October','November','December'],
          weekdays      : ['Sunday','Monday','Tuesday','Wednesday','Thursday','Friday','Saturday'],
          weekdaysShort : ['Sun','Mon','Tue','Wed','Thu','Fri','Sat']
      },
  
      // callback function
      onSelect: null,
      onOpen: null,
      onClose: null,
      onDraw: null
  },
  
  
  /**
   * templating functions to abstract HTML rendering
   */
  renderDayName = function(opts, day, abbr)
  {
      day += opts.firstDay;
      while (day &gt;= 7) {
          day -= 7;
      }
      return abbr ? opts.i18n.weekdaysShort[day] : opts.i18n.weekdays[day];
  },
  
  renderDay = function(i, isSelected, isToday, isDisabled, isEmpty)
  {
      if (isEmpty) {
          return '&lt;td class="is-empty"&gt;&lt;/td&gt;';
      }
      var arr = [];
      if (isDisabled) {
          arr.push('is-disabled');
      }
      if (isToday) {
          arr.push('is-today');
      }
      if (isSelected) {
          arr.push('is-selected');
      }
      return '&lt;td data-day="' + i + '" class="' + arr.join(' ') + '"&gt;&lt;button class="pika-button" type="button"&gt;' + i + '&lt;/button&gt;' + '&lt;/td&gt;';
  },
  
  renderRow = function(days, isRTL)
  {
      return '&lt;tr&gt;' + (isRTL ? days.reverse() : days).join('') + '&lt;/tr&gt;';
  },
  
  renderBody = function(rows)
  {
      return '&lt;tbody&gt;' + rows.join('') + '&lt;/tbody&gt;';
  },
  
  renderHead = function(opts)
  {
      var i, arr = [];
      for (i = 0; i &lt; 7; i++) {
          arr.push('&lt;th scope="col"&gt;&lt;abbr title="' + renderDayName(opts, i) + '"&gt;' + renderDayName(opts, i, true) + '&lt;/abbr&gt;&lt;/th&gt;');
      }
      return '&lt;thead&gt;' + (opts.isRTL ? arr.reverse() : arr).join('') + '&lt;/thead&gt;';
  },
  
  renderTitle = function(instance)
  {
      var i, j, arr,
          opts = instance._o,
          month = instance._m,
          year  = instance._y,
          isMinYear = year === opts.minYear,
          isMaxYear = year === opts.maxYear,
          html = '&lt;div class="pika-title"&gt;',
          prev = true,
          next = true;
  
      for (arr = [], i = 0; i &lt; 12; i++) {
          arr.push('&lt;option value="' + i + '"' +
              (i === month ? ' selected': '') +
              ((isMinYear &amp;&amp; i &lt; opts.minMonth) || (isMaxYear &amp;&amp; i &gt; opts.maxMonth) ? 'disabled' : '') + '&gt;' +
              opts.i18n.months[i] + '&lt;/option&gt;');
      }
      html += '&lt;div class="pika-label"&gt;' + opts.i18n.months[month] + '&lt;select class="pika-select pika-select-month"&gt;' + arr.join('') + '&lt;/select&gt;&lt;/div&gt;';
  
      if (isArray(opts.yearRange)) {
          i = opts.yearRange[0];
          j = opts.yearRange[1] + 1;
      } else {
          i = year - opts.yearRange;
          j = 1 + year + opts.yearRange;
      }
  
      for (arr = []; i &lt; j &amp;&amp; i &lt;= opts.maxYear; i++) {
          if (i &gt;= opts.minYear) {
              arr.push('&lt;option value="' + i + '"' + (i === year ? ' selected': '') + '&gt;' + (i) + '&lt;/option&gt;');
          }
      }
      html += '&lt;div class="pika-label"&gt;' + year + '&lt;select class="pika-select pika-select-year"&gt;' + arr.join('') + '&lt;/select&gt;&lt;/div&gt;';
  
      if (isMinYear &amp;&amp; (month === 0 || opts.minMonth &gt;= month)) {
          prev = false;
      }
  
      if (isMaxYear &amp;&amp; (month === 11 || opts.maxMonth &lt;= month)) {
          next = false;
      }
  
      html += '&lt;button class="pika-prev' + (prev ? '' : ' is-disabled') + '" type="button"&gt;' + opts.i18n.previousMonth + '&lt;/button&gt;';
      html += '&lt;button class="pika-next' + (next ? '' : ' is-disabled') + '" type="button"&gt;' + opts.i18n.nextMonth + '&lt;/button&gt;';
  
      return html += '&lt;/div&gt;';
  },
  
  renderTable = function(opts, data)
  {
      return '&lt;table cellpadding="0" cellspacing="0" class="pika-table"&gt;' + renderHead(opts) + renderBody(data) + '&lt;/table&gt;';
  };
  
  
  /**
   * Pikaday constructor
   */
  window.Pikaday = function(options)
  {
      var self = this,
          opts = self.config(options);
  
      self._onMouseDown = function(e)
      {
          if (!self._v) {
              return;
          }
          e = e || window.event;
          var target = e.target || e.srcElement;
          if (!target) {
              return;
          }
  
          if (!hasClass(target, 'is-disabled')) {
              if (hasClass(target, 'pika-button') &amp;&amp; !hasClass(target, 'is-empty')) {
                  self.setDate(new Date(self._y, self._m, parseInt(target.innerHTML, 10)));
                  if (opts.bound) {
                      sto(function() {
                          self.hide();
                      }, 100);
                  }
                  return;
              }
              else if (hasClass(target, 'pika-prev')) {
                  self.prevMonth();
              }
              else if (hasClass(target, 'pika-next')) {
                  self.nextMonth();
              }
          }
          if (!hasClass(target, 'pika-select')) {
              if (e.preventDefault) {
                  e.preventDefault();
              } else {
                  e.returnValue = false;
                  return false;
              }
          } else {
              self._c = true;
          }
      };
  
      self._onChange = function(e)
      {
          e = e || window.event;
          var target = e.target || e.srcElement;
          if (!target) {
              return;
          }
          if (hasClass(target, 'pika-select-month')) {
              self.gotoMonth(target.value);
          }
          else if (hasClass(target, 'pika-select-year')) {
              self.gotoYear(target.value);
          }
      };
  
      self._onInputChange = function(e)
      {
          var date;
  
          if (e.firedBy === self) {
              return;
          }
          if (hasMoment) {
              date = window.moment(opts.field.value, opts.format);
              date = date ? date.toDate() : null;
          }
          else {
              date = new Date(Date.parse(opts.field.value));
          }
          self.setDate(isDate(date) ? date : null);
          if (!self._v) {
              self.show();
          }
      };
  
      self._onInputFocus = function()
      {
          self.show();
      };
  
      self._onInputClick = function()
      {
          self.show();
      };
  
      self._onInputBlur = function()
      {
          if (!self._c) {
              self._b = sto(function() {
                  self.hide();
              }, 50);
          }
          self._c = false;
      };
  
      self._onClick = function(e)
      {
          e = e || window.event;
          var target = e.target || e.srcElement,
              pEl = target;
          if (!target) {
              return;
          }
          if (!hasEventListeners &amp;&amp; hasClass(target, 'pika-select')) {
              if (!target.onchange) {
                  target.setAttribute('onchange', 'return;');
                  addEvent(target, 'change', self._onChange);
              }
          }
          do {
              if (hasClass(pEl, 'pika-single')) {
                  return;
              }
          }
          while ((pEl = pEl.parentNode));
          if (self._v &amp;&amp; target !== opts.field) {
              self.hide();
          }
      };
  
      self.el = document.createElement('div');
      self.el.className = 'pika-single' + (opts.isRTL ? ' is-rtl' : '');
  
      addEvent(self.el, 'mousedown', self._onMouseDown, true);
      addEvent(self.el, 'change', self._onChange);
  
      if (opts.field) {
          if (opts.bound) {
              document.body.appendChild(self.el);
          } else {
              opts.field.parentNode.insertBefore(self.el, opts.field.nextSibling);
          }
          addEvent(opts.field, 'change', self._onInputChange);
  
          if (!opts.defaultDate) {
              if (hasMoment &amp;&amp; opts.field.value) {
                  opts.defaultDate = window.moment(opts.field.value, opts.format).toDate();
              } else {
                  opts.defaultDate = new Date(Date.parse(opts.field.value));
              }
              opts.setDefaultDate = true;
          }
      }
  
      var defDate = opts.defaultDate;
  
      if (isDate(defDate)) {
          if (opts.setDefaultDate) {
              self.setDate(defDate, true);
          } else {
              self.gotoDate(defDate);
          }
      } else {
          self.gotoDate(new Date());
      }
  
      if (opts.bound) {
          this.hide();
          self.el.className += ' is-bound';
          addEvent(opts.field, 'click', self._onInputClick);
          addEvent(opts.field, 'focus', self._onInputFocus);
          addEvent(opts.field, 'blur', self._onInputBlur);
      } else {
          this.show();
      }
  
  };
  
  
  /**
   * public Pikaday API
   */
  window.Pikaday.prototype = {
  
  
      /**
       * configure functionality
       */
      config: function(options)
      {
          if (!this._o) {
              this._o = extend({}, defaults, true);
          }
  
          var opts = extend(this._o, options, true);
  
          opts.isRTL = !!opts.isRTL;
  
          opts.field = (opts.field &amp;&amp; opts.field.nodeName) ? opts.field : null;
  
          opts.bound = !!(opts.bound !== undefined ? opts.field &amp;&amp; opts.bound : opts.field);
  
          var nom = parseInt(opts.numberOfMonths, 10) || 1;
          opts.numberOfMonths = nom &gt; 4 ? 4 : nom;
  
          if (!isDate(opts.minDate)) {
              opts.minDate = false;
          }
          if (!isDate(opts.maxDate)) {
              opts.maxDate = false;
          }
          if ((opts.minDate &amp;&amp; opts.maxDate) &amp;&amp; opts.maxDate &lt; opts.minDate) {
              opts.maxDate = opts.minDate = false;
          }
          if (opts.minDate) {
              setToStartOfDay(opts.minDate);
              opts.minYear  = opts.minDate.getFullYear();
              opts.minMonth = opts.minDate.getMonth();
          }
          if (opts.maxDate) {
              setToStartOfDay(opts.maxDate);
              opts.maxYear  = opts.maxDate.getFullYear();
              opts.maxMonth = opts.maxDate.getMonth();
          }
  
          if (isArray(opts.yearRange)) {
              var fallback = new Date().getFullYear() - 10;
              opts.yearRange[0] = parseInt(opts.yearRange[0], 10) || fallback;
              opts.yearRange[1] = parseInt(opts.yearRange[1], 10) || fallback;
          } else {
              opts.yearRange = Math.abs(parseInt(opts.yearRange, 10)) || defaults.yearRange;
              if (opts.yearRange &gt; 100) {
                  opts.yearRange = 100;
              }
          }
  
          return opts;
      },
  
      /**
       * return a formatted string of the current selection (using Moment.js if available)
       */
      toString: function(format)
      {
          return !isDate(this._d) ? '' : hasMoment ? window.moment(this._d).format(format || this._o.format) : this._d.toDateString();
      },
  
      /**
       * return a Moment.js object of the current selection (if available)
       */
      getMoment: function()
      {
          return hasMoment ? window.moment(this._d) : null;
      },
  
      /**
       * set the current selection from a Moment.js object (if available)
       */
      setMoment: function(date)
      {
          if (hasMoment &amp;&amp; window.moment.isMoment(date)) {
              this.setDate(date.toDate());
          }
      },
  
      /**
       * return a Date object of the current selection
       */
      getDate: function()
      {
          return isDate(this._d) ? new Date(this._d.getTime()) : null;
      },
  
      /**
       * set the current selection
       */
      setDate: function(date, preventOnSelect)
      {
          if (!date) {
              this._d = null;
              return this.draw();
          }
          if (typeof date === 'string') {
              date = new Date(Date.parse(date));
          }
          if (!isDate(date)) {
              return;
          }
  
          var min = this._o.minDate,
              max = this._o.maxDate;
  
          if (isDate(min) &amp;&amp; date &lt; min) {
              date = min;
          } else if (isDate(max) &amp;&amp; date &gt; max) {
              date = max;
          }
  
          this._d = new Date(date.getTime());
          setToStartOfDay(this._d);
          this.gotoDate(this._d);
  
          if (this._o.field) {
              this._o.field.value = this.toString();
              fireEvent(this._o.field, 'change', { firedBy: this });
          }
          if (!preventOnSelect &amp;&amp; typeof this._o.onSelect === 'function') {
              this._o.onSelect.call(this, this.getDate());
          }
      },
  
      /**
       * change view to a specific date
       */
      gotoDate: function(date)
      {
          if (!isDate(date)) {
              return;
          }
          this._y = date.getFullYear();
          this._m = date.getMonth();
          this.draw();
      },
  
      gotoToday: function()
      {
          this.gotoDate(new Date());
      },
  
      /**
       * change view to a specific month (zero-index, e.g. 0: January)
       */
      gotoMonth: function(month)
      {
          if (!isNaN( (month = parseInt(month, 10)) )) {
              this._m = month &lt; 0 ? 0 : month &gt; 11 ? 11 : month;
              this.draw();
          }
      },
  
      nextMonth: function()
      {
          if (++this._m &gt; 11) {
              this._m = 0;
              this._y++;
          }
          this.draw();
      },
  
      prevMonth: function()
      {
          if (--this._m &lt; 0) {
              this._m = 11;
              this._y--;
          }
          this.draw();
      },
  
      /**
       * change view to a specific full year (e.g. "2012")
       */
      gotoYear: function(year)
      {
          if (!isNaN(year)) {
              this._y = parseInt(year, 10);
              this.draw();
          }
      },
  
      /**
       * refresh the HTML
       */
      draw: function(force)
      {
          if (!this._v &amp;&amp; !force) {
              return;
          }
          var opts = this._o,
              minYear = opts.minYear,
              maxYear = opts.maxYear,
              minMonth = opts.minMonth,
              maxMonth = opts.maxMonth;
  
          if (this._y &lt;= minYear) {
              this._y = minYear;
              if (!isNaN(minMonth) &amp;&amp; this._m &lt; minMonth) {
                  this._m = minMonth;
              }
          }
          if (this._y &gt;= maxYear) {
              this._y = maxYear;
              if (!isNaN(maxMonth) &amp;&amp; this._m &gt; maxMonth) {
                  this._m = maxMonth;
              }
          }
  
          this.el.innerHTML = renderTitle(this) + this.render(this._y, this._m);
  
          if (opts.bound) {
              var pEl  = opts.field,
                  left = pEl.offsetLeft,
                  top  = pEl.offsetTop + pEl.offsetHeight;
              while((pEl = pEl.offsetParent)) {
                  left += pEl.offsetLeft;
                  top  += pEl.offsetTop;
              }
              this.el.style.cssText = 'position:absolute;left:' + left + 'px;top:' + top + 'px;';
              sto(function() {
                  opts.field.focus();
              }, 1);
          }
  
          if (typeof this._o.onDraw === 'function') {
              var self = this;
              sto(function() {
                  self._o.onDraw.call(self);
              }, 0);
          }
      },
  
      /**
       * render HTML for a particular month
       */
      render: function(year, month)
      {
          var opts   = this._o,
              now    = new Date(),
              days   = getDaysInMonth(year, month),
              before = new Date(year, month, 1).getDay(),
              data   = [],
              row    = [];
          setToStartOfDay(now);
          if (opts.firstDay &gt; 0) {
              before -= opts.firstDay;
              if (before &lt; 0) {
                  before += 7;
              }
          }
          var cells = days + before,
              after = cells;
          while(after &gt; 7) {
              after -= 7;
          }
          cells += 7 - after;
          for (var i = 0, r = 0; i &lt; cells; i++)
          {
              var day = new Date(year, month, 1 + (i - before)),
                  isDisabled = (opts.minDate &amp;&amp; day &lt; opts.minDate) || (opts.maxDate &amp;&amp; day &gt; opts.maxDate),
                  isSelected = isDate(this._d) ? compareDates(day, this._d) : false,
                  isToday = compareDates(day, now),
                  isEmpty = i &lt; before || i &gt;= (days + before);
  
              row.push(renderDay(1 + (i - before), isSelected, isToday, isDisabled, isEmpty));
  
              if (++r === 7) {
                  data.push(renderRow(row, opts.isRTL));
                  row = [];
                  r = 0;
              }
          }
          return renderTable(opts, data);
      },
  
      isVisible: function()
      {
          return this._v;
      },
  
      show: function()
      {
          if (!this._v) {
              if (this._o.bound) {
                  addEvent(document, 'click', this._onClick);
              }
              removeClass(this.el, 'is-hidden');
              this._v = true;
              this.draw();
              if (typeof this._o.onOpen === 'function') {
                  this._o.onOpen.call(this);
              }
          }
      },
  
      hide: function()
      {
          var v = this._v;
          if (v !== false) {
              if (this._o.bound) {
                  removeEvent(document, 'click', this._onClick);
              }
              this.el.style.cssText = '';
              addClass(this.el, 'is-hidden');
              this._v = false;
              if (v !== undefined &amp;&amp; typeof this._o.onClose === 'function') {
                  this._o.onClose.call(this);
              }
          }
      },
  
      /**
       * GAME OVER
       */
      destroy: function()
      {
          this.hide();
          removeEvent(this.el, 'mousedown', this._onMouseDown, true);
          removeEvent(this.el, 'change', this._onChange);
          if (this._o.field) {
              removeEvent(this._o.field, 'change', this._onInputChange);
              if (this._o.bound) {
                  removeEvent(this._o.field, 'click', this._onInputClick);
                  removeEvent(this._o.field, 'focus', this._onInputFocus);
                  removeEvent(this._o.field, 'blur', this._onInputBlur);
              }
          }
          if (this.el.parentNode) {
              this.el.parentNode.removeChild(this.el);
          }
      }
  
  };
  
  })(window, window.document);
  </code></pre>