title: How to link fancy radio buttons to same ID?
body: <p>I would like to use these <a href="http://bootsnipp.com/snippets/featured/funky-radio-buttons" rel="nofollow noreferrer">funky radio buttons</a> though the radio buttons have an id=radio1, id=radio2, id=radio3 etc</p>
  
  <p>I would like all of them to have id-radio1 so it writes the result to radio1 in the database:</p>
  
  <p>Here is how I have normal radio buttons working in the past using the same id and they toggle between one another:</p>
  
  <pre><code>      &lt;div class="form-group col-md-12"&gt;
        &lt;label class="control-label form-check-inline"&gt;Gender&lt;/label&gt;*
            &lt;div class="form-group"&gt;       
                      &lt;input type="radio" id="Gender" name="Gender" value="M" required="required" /&gt;&lt;label class="control-label"&gt;Male&lt;/label&gt;
                      &lt;input type="radio" id="Gender" name="Gender" value="F" required="required" /&gt;&lt;label class="control-label"&gt;Female&lt;/label&gt;
            &lt;/div&gt;  
        &lt;/div&gt;
  </code></pre>
  
  <p>$Gender=$_POST["Gender"];</p>
  
  <p>INSERT INTO [dbo].[SubmissionsTBL]
  [Gender]
  VALUES
  (,'".trimText($Gender)."')</p>
  
  <p>Though, with the funky radio buttons chaning from this:</p>
  
  <pre><code>&lt;div class="funkyradio"&gt;
      &lt;div class="funkyradio-primary col-md-6"&gt;
          &lt;input type="radio" name="radio" id="radio1" /&gt;
          &lt;label for="radio1"&gt;Male&lt;/label&gt;
      &lt;/div&gt;
      &lt;div class="funkyradio-primary col-md-6"&gt;
          &lt;input type="radio" name="radio" id="radio2"/&gt;
          &lt;label for="radio2"&gt;Female&lt;/label&gt;
      &lt;/div&gt;
  
  &lt;/div&gt;
  </code></pre>
  
  <p>to this doesn't work - it doesn't allow me to toggle radio buttons:</p>
  
  <pre><code>&lt;div class="funkyradio"&gt;
      &lt;div class="funkyradio-primary col-md-6"&gt;
          &lt;input type="radio" name="radio" id="radio1" /&gt;
          &lt;label for="radio1"&gt;Male&lt;/label&gt;
      &lt;/div&gt;
      &lt;div class="funkyradio-primary col-md-6"&gt;
          &lt;input type="radio" name="radio" id="radio1"/&gt;
          &lt;label for="radio2"&gt;Female&lt;/label&gt;
      &lt;/div&gt;
  
  &lt;/div&gt;
  </code></pre>
  
  <p>What is stopping the toggle?
  Thank you!</p>