Time Over Image

HTML

<article class="post-810 post type-post status-publish format-standard has-post-thumbnail category-fashion entry home-top" itemscope="" itemtype="https://schema.org/CreativeWork"><header class="entry-header"><a class="entry-image-link" href="http://example.com" aria-hidden="true"><img src="http://placehold.it/720x450&text=Image" class="alignleft post-image entry-image" alt="ALT" itemprop="image" width="750" height="420"><time class="entry-time" itemprop="datePublished" datetime="2017-09-21T21:13:24+00:00">September 21, 2017</time></a><h2 class="entry-title" itemprop="headline"><a href="http://example.com" rel="bookmark">Entry Title</a></h2>
<p class="entry-meta"> by <span class="entry-author" itemprop="author" itemscope="" itemtype="https://schema.org/Person"><a href="http://example.com" class="entry-author-link" itemprop="url" rel="author"><span class="entry-author-name" itemprop="name">authorname</span></a></span> <span class="entry-comments-link"><a href="http://example.com/#respond">Leave a Comment</a></span> <a class="post-edit-link" href="http://test.dev/wp-admin/post.php?post=810&amp;action=edit">(Edit)</a></p></header><div class="entry-content" itemprop="text"><p>This is an example of a WordPress post, you could edit this to put information about yourself or your site so readers know where you are coming from. You can create ... <a class="more-link" href="http://example.com">Continue Reading</a></p></div></article>

CSS

.js .content .home-middle a .entry-time,
.js .content .home-top a .entry-time {
	background-color: #e8554e;
	bottom: 24px;
	color: #fff;
	font-size: 14px;
	font-size: 1.4rem;
	font-weight: 300;
	padding: 5px 10px;
	position: absolute;
	right: 0;
}

.js .home-middle a.alignleft,
.js .home-top a.alignleft {
	margin: 0 24px 24px 0;
}

.js .home-middle a.alignright,
.js .home-top a.alignright {
	margin: 0 0 24px 24px;
}

.js .home-middle a.alignleft img,
.js .home-middle a.alignright img,
.js .home-top a.alignleft img,
.js .home-top a.alignright img {
	margin: 0;
}

JavaScript

jQuery(function( $ ){

	// Add js body class.
	$('body').addClass('js');
	
	$('.home-middle article, .home-top article').each(function(){
		var $time = $(this).find('.entry-time');

		$(this).find('a.alignleft, a.alignnone, a.alignright').append($time);

	});

});