JSFiddle - React, Tailwind, and code Playground
HTML
<div id="topjob-contain">
<img src="https://commons.wikimedia.org/wiki/File:Foo.jpg">
<div class="newjobz">
<h1><a href="#" target="_blank">#1 Random Job Title Here</a></h1>
<p>#1 Random Agency Name here</p>
<p>#1 Random Discription of job : .sed diam nonumm tincidunt ut laoreet dolorey nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. </p>
<br clear="all" />
</div>
<div class="newjobz">
<h1><a href="#" target="_blank">#2 Random Job Title Here</a></h1>
<p>#2 Random Agency Name here</p>
<p>#2 Random Discription of job : .sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. </p>
<br clear="all" />
</div>
<div class="newjobz">
<h1><a href="#" target="_blank">#4 Job Title Here</a></h1>
<p>#3 Random Agency Name here</p>
<p>#3 Random Discription of job : .sed diam nonummy t ut laoreet dolore magna aliquam erat volutpat. </p>
<br clear="all" />
</div>
<br clear="all" />
</div>
CSS
.newjobz{ display: none; }
JavaScript
function randomFromTo(from, to) {
return Math.floor(Math.random() * (to - from + 1) + from);
}
function displayRandomJob() {
var r = randomFromTo(1, $('div.newjobz').length);
$('div.newjobz').hide().eq(r - 1).show();
}
$(document).ready(function() {
displayRandomJob();
$('#jobchanger').click(function() {
displayRandomJob();
});
});