Estoy tratando de crear un control deslizante que permita a los usuarios moverse por las revisiones haciendo clic en las flechas. Que pasará de review1 a review2, etc., etc. Esto es lo que tengo hasta ahora, he configurado mi HTML con mis reviews y mi CSS con valores ocultos por el momento. Cualquier ayuda sería muy apreciada

<div class="review1">
    <h1>&ldquo;THIS PLACE IS AMAZING&rdquo;<br></h1>
     <p class= "vancouver">- The Georgia Straight</p>
    </div>

    <div class="review2">
    <h1>&ldquo;A TASTE OF ITALY IN VANCOUVER&rdquo;<br></h1>
     <p class= "Sun">- The Vancouver Sun</p>
    </div>

    <div class="review3">
    <h1>&ldquo;THIS IS THE REAL DEAL&rdquo;<br></h1>
     <p class= "Yelp">- Yelp.ca</p>
    </div>

    <div class="review4">
    <h1>&ldquo;SIMPLY DELICIOUS&rdquo;<br></h1>
     <p class= "Buzz">- VanCity Buzz</p>
    </div>

y mi CSS

.review1{
font-family: Clarendon;
letter-spacing: .2em;
font-size: 22pt;
text-align: center;
padding-top: 200px;
width: 1024px;
}

.review2{
display: none;
font-family: Clarendon;
letter-spacing: .2em;
font-size: 22pt;
text-align: center;
padding-top: 200px;

}

.review3{
display: none;
font-family: Clarendon;
letter-spacing: .2em;
font-size: 22pt;
text-align: center;
padding-top: 200px;

}

.review4{
display: none;
font-family: Clarendon;
letter-spacing: .2em;
font-size: 22pt;
text-align: center;
padding-top: 200px;
}