How can I make my script work with an array?
<p>This Javascript controls a Monial Content box with forward and back buttons to move forwards or backwards but it only works for 2 DIVs, how can I make this script work with an array so I can add more elements?</p>

<p>e.g. </p>

<p><strong>Current Script Diagram</strong></p>

<p><img src="http://i.stack.imgur.com/BWYLH.png" alt="enter image description here"></p>

<p><strong>The Script Code</strong></p>

<pre><code>   $(document).ready(function(e) {
   showQuote();
   $(".left").click(function(e) {
      $("#monial_btn_1").trigger("click"); 
   });
   $(".right").click(function(e) {
      $("#monial_btn_2").trigger("click");
   });


   $("#monial_btn_1").click(function(e) {
       $(".monial_content_1").fadeIn("fast");
       $(".monial_content_2").fadeOut("fast");
       var obj=$(this);
       obj.removeClass();
       obj.addClass("monial_btn_selected");

       obj=$("#monial_btn_2");
       obj.removeClass();
       obj.addClass("monial_btn");
   });

   $("#monial_btn_2").click(function(e) {
       $(".monial_content_1").fadeOut("fast");
       $(".monial_content_2").fadeIn("fast");
       var obj=$(this);
       obj.removeClass();
       obj.addClass("monial_btn_selected");

       obj=$("#monial_btn_1");
       obj.removeClass();
       obj.addClass("monial_btn");
   });
</code></pre>
