배열로 스크립트를 작동 시키려면 어떻게합니까?

Question

이 자바 스크립트는 앞뒤로 움직이기 위해 앞으로 및 뒤로 버튼이있는 Monial Content 상자를 제어하지만 2 개의 DIV에서만 작동합니다.이 스크립트를 배열과 함께 사용하면 더 많은 요소를 추가 할 수 있습니까?

TIL은 무엇을 의미 하는가 "모니 알"무엇 TIL

현재 스크립트도

스크립트 코드

$(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"); 
    }); 

Answer 1

var n = 10 
for(i = 1; i < n; i++) { 
    $("#monial_btn_" + i).click(function(e) { 
     $(".monial_content_" + i).fadeIn("fast"); 
     $(".monial_content_" + (i + 1)).fadeOut("fast"); 
     var obj=$(this); 
     obj.removeClass(); 
     obj.addClass("monial_btn_selected"); 

     obj=$("#monial_btn_" + (i + 1)); 
     obj.removeClass(); 
     obj.addClass("monial_btn"); 
    }); 
}