【jQuery】チェックボックスのON/OFFで、表示/非表示切り替え

チェックボックスのON/OFFで表示/非表示を切り替える。
例えば、tableのtrの表示/非表示を切り替える。

html

<label><input id="hide_over_30" type="checkbox">30歳以上を非表示</label>    

<table>
  <thead>
    <th><td>名前</td><td>年齢</td></th>
  </thead>
  <tbody>
    <tr class="over_30"><td>鈴木</td><td>35</td></tr>
    <tr class="over_30"><td>佐藤</td><td>30</td></tr>
    <tr><td>斎藤</td><td>28</td></tr>
  </tbody>
</table>

チェックボックスが切り替わるごとに、toggle()を使いtrの表示/非表示を切り替えている。

jQuery

$(function(){
  $('#hide_over_30').change(function(){
    $('.over_30').toggle();
  })
})