Is it possible to set Slick Slider toggle buttons for ::before, ::after?

Question

JavaScript

Good afternoon, help assign slider buttons for before or after.
Due to the peculiarities of the layout, it is impossible to do it differently.
Here is the slider code:

$(document).ready(function(){
  $('.carousel-submenu').slick({
    infinite: false,
    slidesToShow: 6,
    slidesToScroll: 1,
    arrows: true,
    prevArrow: $('.sub-menu:before'),
    nextArrow: $('.sub-menu:after'),
  });
});

Here is the layout of the site:

<div class="sub-menu carousel-submenu">
нужна кнопка тут ::before
       <div class="sub-menu_item">
           содержимое....
      </div>
      <div class="sub-menu_item">
           содержимое....
      </div>
      <div class="sub-menu_item">
           содержимое....
      </div>
и тут ::after
</div>

Answer 1

Use appendArrows:$('.carousel-submenu')
2 button buttons will appear at the top and bottom just in the places where you need it and for sub-menu_item - slick itself will add a wrapper for
these buttons, then you can style it as you like for the button font to make 0px
and add button pseudo-elements, the same can be done with dots.
It's probably not the right solution for you, but it will work.

Answer 2

replace Yandex,
check CSStitles=soup.select('h2.serp-item__title')