title: Couldn't make the dropdown flyout close immediately after radio is selected
body: <pre><code>&lt;div class="Dropdown js-toggle-only open"&gt;
              &lt;div&gt;
                &lt;span&gt;
                    Cat (once select radio, value will be appended)
                  &lt;/span&gt;
              &lt;/div&gt;
              &lt;div class="DropdownMenu js-toggle-only open"&gt;
                  &lt;label&gt;
                    All
                  &lt;/label&gt;
                  &lt;input type="radio" name="section" checked&gt;
  
                  &lt;label&gt;
                    Dog
                  &lt;/label&gt;
                  &lt;input type="radio" name="section" value="Dog"&gt;
  
                  &lt;label&gt;
                   Horse
                  &lt;/label&gt;
                  &lt;input type="radio" name="section" value="Horse"&gt;
              &lt;/div&gt;
            &lt;/div&gt;
  </code></pre>
  
  <h2>JQuery</h2>
  
  <pre><code>var radios = $("input[name='section']");
  if (radios.is(':checked')){
      var toggle = $('js-toggle-only');
      toggle.removeClass('open');
  }
  </code></pre>
  
  <p>Tried click or if to have 'open' class removed, but open class stayed. When the dropdown flyout opened, it should be closed immediately after selecting one of the radios. Couldn't figure how to force or take open class out once one radio is selected. </p>