How to show one div of many, per page refresh?

The JavaScript below will show the blockquote in the markup one every 6000 ms. I want to change this behaviour to only show one every page load. I am ok with loading all of them in the markup, I just want to only a random one in every page load.

<script type="text/javascript">
jQuery(document).ready( function(){
    jQuery('.quotes').innerfade({
        animationtype: 'fade',
        speed: 'normal',
        timeout: 6000,
        type: 'random_start',
    });

});
</script>

As a bonus, If JavaScript is disabled in the browser I will like to only show one.

<div class="quotes innerfade" style="position: relative; height: 277px;">
    <div class="quote" style="z-index: 8; position: absolute; display: none;">
        <blockquote><p>“Throw out costs by more than 50%.”</p></blockquote>
                        <cite>Da John @ Con Pi LLC</cite>
                    </div>

                    <div class="quote" style="z-index: 7; position: absolute; display: none;">
                        <blockquote><p>“Georgio pany.”</p>
</blockquote>
                        <cite>Kn Maez, Mnet</cite>
                    </div>

                    <div class="quote" style="z-index: 6; position: absolute; display: block;">
                        <blockquote><p>“…He hae is available.”</p>
</blockquote>
                        <cite>Dan net</cite>
                    </div>

                    <div class="quote" style="z-index: 5; position: absolute; display: none;">
                        <blockquote><p>“Georommend without a d开发者_Python百科oubt.”</p>
</blockquote>
                        <cite>Jorge Suár Puerto Rico</cite>
                    </div>

                    <div class="quote" style="z-index: 4; position: absolute; display: none;">
                        <blockquote><p>“Siain tomorrow…”</p>
</blockquote>
                        <cite>Cha, Inc.</cite>
                    </div>
                </div>

If you want to see the website where the code is you can go to http://www.kiragiannis.com look at the bottom right section of the page something called "testimonials"

You can use a random number based on the element length and the .eq() method with the following jQuery:

var whichToShow = Math.floor(Math.random() * $('.quote').length);

$('.quote').hide().eq(whichToShow).fadeIn(1000);

Here's a fiddle demo. Click "Run" to see new random quote.

Hide them all, and have them with id quoteN where N is an integer from 0 to nr of quotes. Then use math.random to select an N to show. Build the id string and show it when document is ready.