javascript - ウィンドウ幅での JQuery の追加/削除クラス

Question

ウィンドウに基づいてクラスを追加/削除する小さなスクリプトを作成しようとすると、

任意の助けをいただければ幸いです。

<script type="text/javascript">
  $(document).ready( function() {
    if ($(window).width() < 500) {
     $('.single-post-rating').removeClass('col-xs-3');
     $('.single-post-rating').addClass('col-xs-12');
     $('.guide-excerpt').removeClass('col-xs-9');
     $('.guide-excerpt').addClass('col-xs-12');
    }
    else {
     $('.single-post-rating').addClass('col-xs-3');
     $('.single-post-rating').removeClass('col-xs-12');
     $('.guide-excerpt').addClass('col-xs-9');
     $('.guide-excerpt').removeClass('col-xs-12');
    }
  });
</script>