Прокрутите до контейнера категорий по клику визуального композитора

Question

Я использую Visual Composer в WordPress, и когда я нажимаю на категорию портфолио / сообщение, содержание ниже изменяется, чтобы показать его соответствующие изображения. К сожалению, из-за размера кнопок не всегда сразу видно, что содержимое ниже изменилось, а скорее выглядит как неработающая ссылка.

Помимо изменения содержимого ниже, я также пытаюсь сделать так, чтобы он прокручивался до верхней части контейнера с изотопами с его изображениями ниже.

Поэтому, по сути, когда я нажимаю на ссылку, которая имеет класс "filter-cat-26" Я хочу, чтобы это прокручивалось до вершины '.isotope-container' и затем повторите с остальными фильтрами.

Вывод html в wordpress выглядит следующим образом:

<div class="isotope-filters>    
  <div class="menu-horizontal"> 
    <ul class="menu-smart">
      <li class="filter-cat-26">
        <span>
          <a href="#" data-filter="grid-cat-26" class="active">Developers</a>
        </span>
      </li>
    </ul>
  </div>
</div>

Я пробовал несколько вариантов, но ни один из них не работает, и в некоторых случаях я получаю ошибку "неожиданного токена" или "$ не является функцией" в Wordpress, которую я пытался исправить.

У меня нет реальных навыков в этой области, но я стараюсь изо всех сил через форумы - это то, что я пытался далеко:

<script>
$(".filter-cat-26").click(function() {
    $('html,body').animate({
    scrollTop: $(".isotope-container").offset().top},
    'slow');
});
</script>

Это заработало мне '$ не функция', поэтому я попробовал это:

<script>
jQuery(function ($)(".filter-cat-26").click(function() {
    $('html, body').animate({
        scrollTop: $(".isotope-container").offset().top
    }, 2000);
})

</script>

И я тоже попробовал

<script>
$(".isotope-filters").click(function() {
    $('html,body').animate({
        scrollTop: $(".isotope-containers").offset().top},
        'slow');
});
</script>

И несколько вариантов, ни один из которых не работал - любая помощь будет оценена.