Прошу помощи. Нужно сделать взаимосвязь ссылки (a)
c select option.
Сейчас работает при клике a.select-change
меняется option, но мне нужно сделать так, чтобы этой ссылке еще добавлялся класс a.selected
из соответствующего option selected="selected".
(function($) {
$('.select-change').click(function() {
$('#orderby').val($(this).data('val')).trigger('change');
})
})(jQuery);
a {
padding:10px;
color:green;
}
a.selected {
color:red;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div class="order_by_wr">
<a data-role="button" data-val="menu_order" class="select-change" id="btna">Name</a>
<a data-role="button" data-val="popularity" class="select-change" id="btnb">Popular</a>
<a data-role="button" data-val="price-desc" class="select-change" id="btnc">Price</a>
<form class="woocommerce-ordering" method="get">
<select name="orderby" class="orderby" id="orderby">
<option value="menu_order" selected="selected">Name</option>
<option value="popularity">Popular</option>
<option value="price-desc">Price</option>
</select>
</form>
</div>