JSFiddle - React, Tailwind, and code Playground
HTML
<div class="news-date left date-obj">
22-Jul-2013
</div>
<div class="news-date left date-obj">
21-Jul-2013
</div>
<div class="news-date left date-obj">
21-Oct-2012
</div>
<div class="news-date left date-obj">
1-Jan-2013
</div>
<p class="console"></p>
JavaScript
(function ( $ ) {
$.fn.bcDateModify = function() {
return this.each(function() {
var obj = this;
var srcDate= $(obj).html();
srcDate = srcDate.replace(/\s+/g, '');
var dateSplit = srcDate.split("-");
objDate = new Date(dateSplit[1] + " " + dateSplit[0] + ", " + dateSplit[2]);
var newDate = objDate.getDate();
var newDay = objDate.getDay();
var newMonth = objDate.getMonth();
var newYear = objDate.getFullYear();
var weekday=new Array("Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday");
var monthNames=new Array("Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec");
var myhtml ='<div class="date"><span>'+newDate+'</span></div><div class="month-day"><h3>'+weekday[newDay]+'</h3><span>'+monthNames[newMonth]+' | '+newYear+'</span></div>';
$(obj).html(myhtml);
});
$('.console').html('yahoo');
};
}( jQuery ));
$(document).ready(function(){
$('.date-obj').bcDateModify();
});