How could I do in JavaScript the buttons on my slider work

How could I make the previous and next JavaScript buttons work?

<div class="c-sliders-slideshow">
    <div class="o--sliders-container">
      <button class="o--sliders__buttons prev-button" value="prev"><a href="">anterior</a>
      </button>
      <button class="o--sliders__buttons next-button" value="next"><a href="">proximo</a>
     </button> 
           <ul class="o--slider-images-list">
               <li><a href=""><img id="1" src="images/banner-example.jpg" alt=""></a></li>
               <li><a href=""><img id="2" src="images/banner-example2.gif" alt=""></a></li>
               <li><a href=""><img id="3" src="images/banner-example.jpg" alt=""></a></li>
               <li><a href=""><img id="4" src="images/banner-example2.gif" alt=""></a></li>

           </ul>
           <ul class="o--sliders-controllers align-center">
              <li class="is-active"><a href=""></a></li>
              <li><a href=""></a></li>
              <li><a href=""></a></li>
              <li><a href=""></a></li>
           </ul> 

    </div>
    </div>