Доброе время суток!
Помогите пожалуйста решить задачу.
Есть простой список из n-го количества элементов
<ul>
<li></li>
<li></li>
<li></li>
<li></li>
</ul>
Еще есть точно такое же количество элементов кнопок
<div class="owl-dots">
<button role="button" class="owl-dot"></button>
<button role="button" class="owl-dot"></button>
<button role="button" class="owl-dot active"></button>
<button role="button" class="owl-dot"></button>
</div>
Кнопки принадлежат к плагину Owl Carousel и текущий элемент выделяется классом "active".
Суть задачи в следующем, необходимо присваивать class active или current нужному элементу списка в зависимости от того, какой button на текущей момент имеет class active.
Думаю связать элементы списка и кнопки data-атрибутами, например должно получится примерно так:
<ul>
<li data-item="1"></li>
<li data-item="2"></li>
<li data-item="3" class="current"></li>
<li data-item="4"></li>
</ul>
<div class="owl-dots">
<button data-item="1" role="button" class="owl-dot"></button>
<button data-item="2" role="button" class="owl-dot"></button>
<button data-item="3" role="button" class="owl-dot active"></button>
<button data-item="4" role="button" class="owl-dot"></button>
</div>
Помогите пожалуйста написать скрипт, который будет находить button с классом active и присваивать класс active или current нужному элементу списка