title: Checkbox / radio is checked="checked" in HTML but it looks like unchecked
body: <p>I'm trying to ensure that user can only select one checkbox, but it looks like nothing is checked. What am I doing wrong?</p>
  
  <pre><code>&lt;div class="formField rsform-block rsform-block-typprofilu"&gt;
      &lt;br&gt;
      &lt;input name="form[typprofilu][]" type="checkbox" value="Montreal (Oceľ)" id="typprofilu0" checked="checked"&gt;
      &lt;label for="typprofilu0"&gt;Montreal (Oceľ)&lt;/label&gt;
      &lt;input name="form[typprofilu][]" type="checkbox" value="Halifax (Oceľ)" id="typprofilu1"&gt;
      &lt;label for="typprofilu1"&gt;Halifax (Oceľ)&lt;/label&gt;
      &lt;input name="form[typprofilu][]" type="checkbox" value="Calgary (Hliník)" id="typprofilu2"&gt;
      &lt;label for="typprofilu2"&gt;Calgary (Hliník)&lt;/label&gt;
      &lt;input name="form[typprofilu][]" type="checkbox" value="Niagara (Hliník)" id="typprofilu3"&gt;
      &lt;label for="typprofilu3"&gt;Niagara (Hliník)&lt;/label&gt;
      &lt;input name="form[typprofilu][]" type="checkbox" value="Hudson (Hliník)" id="typprofilu4"&gt;
      &lt;label for="typprofilu4"&gt;Hudson (Hliník)&lt;/label&gt;&lt;br&gt;
      &lt;span id="component781" class="formNoError"&gt;Invalid Input&lt;/span&gt;
      &lt;br&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>jQuery:</p>
  
  <pre><code>jQuery('.rsform-block-typprofilu input#typprofilu0[type="checkbox"]').attr('checked',true); 
  
      jQuery('body').on('click','.rsform-block-typprofilu input[name="form[typprofilu][]"]',function(){
                  jQuery('.rsform-block-typprofilu input[name="form[typprofilu][]"]').attr('checked', false);
                  var whatIsChecked = jQuery(this).attr('id');
                  //var isChecked = jQuery(this).is(':checked');   
                  jQuery(this).attr('id',whatIsChecked).attr('checked',true);
              });
  </code></pre>
  
  <p>EDITED: solution with radio buttons</p>
  
  <pre><code>&lt;div class="formField rsform-block rsform-block-typprofilu"&gt;
          &lt;br&gt;
          &lt;input name="form[typprofilu]" type="radio" value="Montreal (Oceľ)" id="typprofilu0" checked="checked"&gt;&lt;label for="typprofilu0"&gt;Montreal (Oceľ)&lt;/label&gt;&lt;input name="form[typprofilu]" type="radio" value="Halifax (Oceľ)" id="typprofilu1"&gt;&lt;label for="typprofilu1"&gt;Halifax (Oceľ)&lt;/label&gt;&lt;input name="form[typprofilu]" type="radio" value="Calgary (Hliník)" id="typprofilu2"&gt;&lt;label for="typprofilu2"&gt;Calgary (Hliník)&lt;/label&gt;&lt;input name="form[typprofilu]" type="radio" value="Niagara (Hliník)" id="typprofilu3"&gt;&lt;label for="typprofilu3"&gt;Niagara (Hliník)&lt;/label&gt;&lt;input name="form[typprofilu]" type="radio" value="Hudson (Hliník)" id="typprofilu4"&gt;&lt;label for="typprofilu4"&gt;Hudson (Hliník)&lt;/label&gt;&lt;br&gt;
          &lt;span id="component782" class="formNoError"&gt;Invalid Input&lt;/span&gt;
          &lt;br&gt;
      &lt;/div&gt;
  
   jQuery('.rsform-block-typprofilu input#typprofilu0[type="radio"]').attr('checked',true);
  
  jQuery('body').on('click','.rsform-block-typprofilu input[name="form[typprofilu]"]',function(){ // ez a radiok kozul a valasztasom
      jQuery('.rsform-block-typprofilu input[name="form[typprofilu]"]').attr('checked', false);
  var whatIsChecked = jQuery(this).attr('id');
      var isChecked = jQuery(this).is(':checked');
  
       jQuery(this).attr('id',whatIsChecked).attr('checked',true);
  });
  </code></pre>
  
  <p>It doesnt change ... the selected is the first ... but in the HTML it seems it change the checked attr.</p>