How to unselect all radio button in radio group using Jquery?

Question

I designed my mobile application using Codiqa. So all css and js are loading from the link. I don't know how to uncheck all radio buttons in a radiobutton list. I tried many coding but its not working for me. HTML:

       <div data-role="fieldcontain" data-controltype="radiobuttons">
          <fieldset data-role="controlgroup" data-type="vertical">
              <legend>
                  Shift
              </legend>
              <input id="radio1" name="rbtnShift" value="1" data-theme="c" type="radio">
              <label for="radio1">
                  AM
              </label>
              <input id="radio2" name="rbtnShift" value="2" data-theme="c" type="radio">
              <label for="radio2">
                  PM
              </label>
              <input id="radio3" name="rbtnShift" value="3" data-theme="c" type="radio">
              <label for="radio3">
                  Night
              </label>
          </fieldset>
      </div>

Jquery:

  $("input:radio[name='rbtnShift']").each(function (i) {        
        this.checked = false;
    });

I tried above coding but its not working for me. I'm certainly missing something basic, but I can't figure out what is the problem.

First, I select a option

After button click, it showing the same like given below

Answer 1

Using knockout.js, below code for unselect all radio buttons in a list

 $("input[type='radio']").checkboxradio();         
 $("input[name^='rbtnShift']").attr("checked", false).checkboxradio("refresh");

Use below code for dynamically selecting a radio buttons in a list,

$("input[type='radio']").checkboxradio();           
$("input[name=rbtnShift][value=" + 1 + "]").prop('checked', true);
$("input[name^='rbtnShift']").attr("checked", true).checkboxradio("refresh");

Answer 2

You can give them a classname and try:

$('.classname').prop('checked', false);

Answer 3

You may try this also;

$('input:radio[name="rbtnShift"]').removeAttr('checked');