ラジオボタンの選択解除の実装方法

Question

一度選択したラジオボタンを再度押下することで、選択解除をしたいのですが、選択解除が下記のコードではできないため、アドバイスを頂きたいです。

デバッグをしたところ、再度押下した際に下記jsの「$(this).prop('checked', false);」にて選択が一瞬解除されるのですが、if文終了後、選択された状態に戻ってしまう模様です。

よろしくお願い致します。

<div class="checkboxTab">
  <ul id="grade">
    <li><input type="radio" name="grade" value="一年生" id="elem"><label for="elem">一年生</label></li>
    <li><input type="radio" name="grade" value="二年生" id="junior"><label for="junior">二年生</label></li>
    <li><input type="radio" name="grade" value="三年生" id="high"><label for="high">三年生</label></li>
  </ul>
</div>

var nowchecked = $('input[name=grade]:checked').val();
$('input[name=grade]').click(function(){
	if($(this).val() == nowchecked) {
		$(this).prop('checked', false);
		nowchecked = false;
	} else {
		nowchecked = $(this).val();
	}
});

Comments

[kei344]

質問タグの「Java」は「JavaScript」の間違いでは？

[kei344]

https://jsfiddle.net/b5og8tu9/ 状況が再現しません。書かれている状況が再現するコード（HTML/CSS/JavaScriptなど）か、再現するURLを提示されたほうが回答を得やすいと思います。

[kei344]

質問タグは修正してくださいね。

[ShoSakata]

失礼致しました。修正しました。

Answer 1

こちらコードには問題なく、キャッシュをクリアすることで、想定通りに動きました。
ご覧になった方にはお手数をおかけしてしまい、申しけないです。