Javascript OR jQuery display random element on page refresh

Here's one way jsFiddle

<aside id="reviews">
    <article class="review"></article>
    <article class="review"></article>
    <article class="review"></article>
</aside>​

and

var $reviews = $('#reviews .review').hide();
$reviews.eq(Math.random()*$reviews.length).show();​

But unless you plan on revealing the other reviews at some point (slider, or pagination), you should really do this server side. Sending people content just to hide it is a little wasteful.

jQuery is JavaScript. To get a random element from an array, use Math.random():

function getRandomElement(a) {
    return a[Math.floor(Math.random() * a.length)];
}

I would use knockout.js which is great for binding JavaScript objects to DOM. You can fill an array of your object and data-bind it to the div. Each time you will bind a random element of the array to the div. The data binding is very simple:

<p>First name: <input data-bind="value: firstName" /></p>


// This is a simple *viewmodel* - JavaScript that defines the data and behavior of your UI
function AppViewModel() {
 this.firstName = "Bert";  
}

// Activates knockout.js
ko.applyBindings(new AppViewModel());

For more examples see the great tutorials in: Knockout.js tutorials