動的要素に複数のクラスを追加するにはどうすればいいですか？

Question

私はカスタムクラスでスワイプスライダーを使っていくつかのスライドを作成しようとしています。

<!-- Swiper --> 
<div class="swiper-container"> 
    <div class="swiper-wrapper"> 
     <div class="swiper-slide">Slide 1</div> 
     <div class="swiper-slide">Slide 2</div> 
     <div class="swiper-slide">Slide 3</div> 
     <div class="swiper-slide">Slide 4</div> 
     <div class="swiper-slide">Slide 5</div> 
     <div class="swiper-slide">Slide 6</div> 
     <div class="swiper-slide">Slide 7</div> 
     <div class="swiper-slide">Slide 8</div> 
     <div class="swiper-slide">Slide 9</div> 
     <div class="swiper-slide">Slide 10</div> 
    </div> 
    <!-- Add Pagination --> 
    <div class="swiper-pagination"></div> 
</div> 
<!-- Swiper JS --> 
<script src="../dist/js/swiper.min.js"></script> 
<!-- Initialize Swiper --> 
<script> 
var swiper = new Swiper('.swiper-container', { 
    pagination: '.swiper-pagination', 
    paginationClickable: true, 
    paginationBulletRender: function (swiper, index, className) { 
     return '<span class="' + className + '">' + (index + 1) + '</span>'; 
    } 
}); 
</script> 

スワイプ改ページが動的に作成され、私は色の追加のカスタムクラスを追加するにはどうすればよい

<span class="swiper-pagination-bullet color-0">1</span> 
<span class="swiper-pagination-bullet color-1">2</span> 
<span class="swiper-pagination-bullet color-2">3</span> 

にページネーションswiperのdivクラスを持ちたい

<span class="swiper-pagination-bullet">1</span> 
<span class="swiper-pagination-bullet">2</span> 
<span class="swiper-pagination-bullet">3</span> 
<span class="swiper-pagination-bullet">4</span> 
<span class="swiper-pagination-bullet">5</span> 
<span class="swiper-pagination-bullet">6</span> 

に生成します-0、color-1、color-2？どうもありがとうございます。

Answer 1

return '<span class="'+ className +' color-'+index+'" >'+(index+1)+'</span>';