title: jQuery call click on radio button without causing a change event
body: <p>Click events trigger change events in jQuery. Is there any way around this? I have a radio button that when clicked, calls a click event on another radio button in a separate set of radio buttons. But I only want the first radio button that was clicked to go through my "change" function. To simplify, 1A and 2A are currently selected. If you change 2A to 2B, then the change function should be called on <code>input[menu2]</code>. What I want to do is if you change 1A to 1B, then the change function should be called on <code>input[menu1]</code> but not on <code>input[menu2]</code>.</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>$(document).ready(function() {
  
    $("#1A").on("click", function() {
      $("#2A").click();
    });
  
    $("#1B").on("click", function() {
      $("#2B").click();
    });
  
  // The problem is here...if menu1 is clicked, then menu2 is also clicked so this is called twice. I want it so that when menu1 is clicked, menu2's click does not hit this function.
    $("input[name='menu1'], input[name='menu2']").on("change", function() {
      // Confirmation modal appears...
      if (user.confirmChange = true) {
        // Keep things the way they are...
      } else {
        // Put things back to their original settings.
      }
  
    });
  });</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"&gt;&lt;/script&gt;
  
  &lt;div id="menu1"&gt;
    &lt;input type="radio" name="menu1opt" value="menu1OptA" id="1A" checked&gt;Menu 1 Option A /&gt;
    &lt;input type="radio" name="menu1opt" value="menu1OptB" id="1B"&gt;Menu 1 Option B /&gt;
  &lt;/div&gt;
  
  &lt;div id="menu2"&gt;
    &lt;input type="radio" name="menu2opt" value="menu2OptA" id="2A" checked&gt;Menu 2 Option A /&gt;
    &lt;input type="radio" name="menu2opt" value="menu2OptB" id="2B"&gt;Menu 2 Option B /&gt;
  &lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>