javascript - jQuery - On active class -


i have materlize collapsible list. want do, change icon of list item when clicks on it. question is, how add event listener checks see if clicked on li, , change icon? collapsible list adds 'active' class li. however, when try listen change, no event fired.

script

$(document).ready(function(){     $(".collapsible li").on('active', function(){         console.log("found event");      }); }); 

list

  <ul class="collapsible" data-collapsible="accordion">     <li>       <div class="collapsible-header"><i class="material-icons">filter_drama</i>first</div>       <div class="collapsible-body"><span>lorem ipsum dolor sit amet.</span></div>     </li>     <li>       <div class="collapsible-header"><i class="material-icons">place</i>second</div>       <div class="collapsible-body"><span>lorem ipsum dolor sit amet.</span></div>     </li>     <li>       <div class="collapsible-header"><i class="material-icons">whatshot</i>third</div>       <div class="collapsible-body"><span>lorem ipsum dolor sit amet.</span></div>     </li>   </ul> 

$(document).ready(function(){     $(".collapsible li").on('click', function(){         // *this* refers current element         $(this).find('.material-icons').html('icon_name');     }); }); 

Comments

Popular posts from this blog

ubuntu - PHP script to find files of certain extensions in a directory, returns populated array when run in browser, but empty array when run from terminal -

php - How can i create a user dashboard -

javascript - How to detect toggling of the fullscreen-toolbar in jQuery Mobile? -