title: Setting a radio button to checked in jquery not showing it as checked in view
body: <p>On document ready I'm setting a radio button to checked, I want the user to see the button as highlighted/discolored. But nothing is showing in the view.
  Here is my html. Nothing shows it as being checked in the view or HTML. It's the same color as all the other radio buttons.</p>
  
  <pre><code>&lt;div class="btn-group" data-toggle="buttons" id="SpaceType"&gt;
                      &lt;label class="btn btn-primary"&gt;
                          &lt;input type="radio" name="typeoptions" id="0" autocomplete="off"&gt; House
                      &lt;/label&gt;
                      &lt;label class="btn btn-primary"&gt;
                          &lt;input type="radio" name="typeoptions" id="1" autocomplete="off"&gt; Apartment
                      &lt;/label&gt;
                      &lt;label class="btn btn-primary"&gt;
                          &lt;input type="radio" name="typeoptions" id="2" autocomplete="off"&gt; Studio
                      &lt;/label&gt;
                      &lt;label class="btn btn-primary"&gt;
                          &lt;input type="radio" name="typeoptions" id="3" autocomplete="off"&gt; Other
                      &lt;/label&gt;
                  &lt;/div&gt;
  </code></pre>
  
  <p>Here is my jquery. </p>
  
  <pre><code>if ($("#YogaSpaceType").val() != "") {
      var t = $("#YogaSpaceType").val();
      var element = '#SpaceType.' + t;
      //$(element).prop('checked', true);
      $('input:radio[id=SpaceType][id=0]').prop('checked', true);
  }
  </code></pre>
  
  <p>I tried both lines including the one that is commented out.
  If I add 'checked' to the element like below the HTML shows it as checked but I see nothing in the view as checked, it still looks unchecked.</p>
  
  <pre><code>&lt;input type="radio" name="typeoptions" id="0" autocomplete="off" checked&gt; House
  </code></pre>