Is there a way I could get the buttons in this cell to have their click functionality?

Right now this cell just returns the buttons (in div.button-group) but their click functionality isn't working.

buildLegendButtons = {
  
  $('button.prev').click(function(){
    let i = parseInt($(this).attr('index'));
    if($(this).hasClass('active')){
      i = i-1;
      $(this).attr('index',i);
      $('.next').attr('index',i);
      $('.next').removeClass('deactive').addClass('active');
      if (i === 0) {
        $('.prev').addClass('deactive').removeClass('active');
      }
    }
  })

  $('button.next').click(function(){
    let i = parseInt($(this).attr('index'));
    if($(this).hasClass('active')){
      i = i+1;
      $(this).attr('index',i);
      $('.prev').attr('index',i);
      $('.prev').removeClass('deactive').addClass('active');
      if (i === insights.length-1) { 
        $('.next').addClass('deactive').removeClass('active');
      }
    }
  })

  return html`
    <div class='button-group' style='padding-left: 15px'>
      <button class='horizontal-buttons deactive prev' index='0'><</button>
      <button class='horizontal-buttons active next' index='0'>></button>
    </div>`;
}