検索フォーム入力をクリアに(リセット)する #jQuery

検索フォームに入力した内容をクリアにする

JQuery箇所は「SE奮闘記」さんのブログそのまんまです。
反復練習用としてメモ。

●参考URL
http://se-suganuma.blogspot.jp/2010/08/javascriptjquery.html

●やりたいこと
クリアボタンをクリック
∟ → id「searchArea」の範囲内の、指定したval値を空にする
　 ∟ → radio,checkbox の場合は、チェックを外す設定に
　 ∟ → それ以外(今回はinput[type=text])はvalue値を空に

sample

<!DOCTYPE html>
<html lang="ja">
<head>
  <meta charset="UTF-8">
  <title>検索フォームの入力内容をクリアにするJQuery</title>
</head>
<body>
  <!-- 検索フォームHTMLサンプル -->
  <section id="searchArea">
    <div>
      <input type="text">
    </div>
    <div>
      <select>
        <option value="0" selected>-</option>
        <option value="1">選択1</option>
        <option value="1">選択2</option>
      </select>
    </div>
    <div>
      <input type="radio" name="radiosample" id="radioA" value="1"><label for="radioA">a</label>
      <input type="radio" name="radiosample" id="radioB" value="2"><label for="radioB">b</label>
    </div>
    <div>
      <input type="checkbox" name="" id="checkA"><lebel for="checkA">A</lebel>
      <input type="checkbox" name="" id="checkB"><lebel for="checkB">B</lebel>
    </div>
  </section>
  <button id="sampleBtn">入力・選択内容のクリア</button>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
  <script>
  $(function(){
      $('#sampleBtn').click(function(){
          $('#searchArea input, #searchArea select').each(function(){
            //checkboxまたはradioボタンの時
            if(this.type == 'checkbox' || this.type == 'radio'){
              //一括でチェックを外す
                this.checked = false;
            }
            //checkboxまたはradioボタン以外の時
            else{
              // val値を空にする
              $(this).val('');
            }
          });
      });
  });
  </script>
</body>
</html>