如何使用jQuery和MaterializeCSS切换图标？

<!-- 引入jQuery -->
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>

<!-- 引入MaterializeCSS -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/css/materialize.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/js/materialize.min.js"></script>

<a id="icon-toggle" class="btn"><i class="material-icons">favorite</i></a>

$(document).ready(function() {
  $('#icon-toggle').click(function() {
    $('i', this).toggleClass('favorite favorite_border');
  });
});