Source : Toggle Icon when Toggler Fires?
1 2 3 4 5 6 7 8 9 10 11 |
jQuery(document).ready(function(){ // Toggle Icon when Toggler Fires jQuery('.flights-primary-info').on('click', function(){ var getClickedItemID = jQuery(this).attr('data-toggle'); jQuery('.flights-secondary-info[id="'+getClickedItemID+'"]').on('on.zf.toggler off.zf.toggler', function(e) { jQuery('.flights-primary-info[data-toggle="'+getClickedItemID+'"') .find('.iconfont') .toggleClass('iconfont-chevron-up iconfont-chevron-down'); }); }); }); |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 |
<li class="flights-list-item"> <!-- always visible --> <a class="flights-primary-info" data-toggle="secondary"> <div class="row"> <div class="columns shrink"> <i class="iconfont iconfont-chevron-down" /> </div> </div> </a> <!-- end: always visible --> <!-- toggle on click --> <div class="is-hidden flights-secondary-info" id="secondary" data-toggler="is-hidden"> </div> <!-- end: toggle on click --> </li> |