title: JQuery - Set dropdown values based on other dropdown value
body: <p>I have three dropdown values like below</p>
  
  <p>As you can see, If one dropdown's value is not equals to "All", I need to set other dropdown values to "All". What is happening now is, if I change the first dropdown' value other values are setting properly, but when I change the second dropdown, first dropdown is not setting to "All". It is working in reverse order. After setting all values I need to send the variables as parameters to a function call.</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>  var selActuals = $('#actuals_dropdown').val();
    var selBudget = $('#budget_dropdown').val();
    var selYTD = $('#ytd_dropdown').val();
  
    if (selActuals != "All") {
      $('#budget_dropdown').val("All");
      $('#ytd_dropdown').val("All");
    } else if (selBudget != "All") {
      $('#actuals_dropdown').val("All");
      $('#ytd_dropdown').val("All");
    } else if (selYTD != "All") {
      $('#actuals_dropdown').val("All");
      $('#budget_dropdown').val("All");
    }</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 class="region-block"&gt;
    &lt;div class="lbl"&gt;Yearly Actuals:&lt;/div&gt;
    &lt;div class="ftr"&gt;
      &lt;select id="actuals_dropdown" name="actuals_dropdown" style="width: 100%;"&gt;
        &lt;option value="All"&gt;Sort By&lt;/option&gt;
        &lt;option value="DESC"&gt;DESC&lt;/option&gt;
        &lt;option value="ASC"&gt;ASC&lt;/option&gt;
      &lt;/select&gt;
    &lt;/div&gt;
  &lt;/div&gt;
  
  &lt;div class="region-block"&gt;
    &lt;div class="lbl"&gt;Yearly Budget:&lt;/div&gt;
    &lt;div class="ftr"&gt;
      &lt;select id="budget_dropdown" name="budget_dropdown" style="width: 100%;"&gt;
        &lt;option value="All"&gt;Sort By&lt;/option&gt;
        &lt;option value="DESC"&gt;DESC&lt;/option&gt;
        &lt;option value="ASC"&gt;ASC&lt;/option&gt;
      &lt;/select&gt;
    &lt;/div&gt;
  &lt;/div&gt;
  
  &lt;div class="region-block"&gt;
    &lt;div class="lbl"&gt;YTD:&lt;/div&gt;
    &lt;div class="ftr"&gt;
      &lt;select id="ytd_dropdown" name="ytd_dropdown" style="width: 100%;"&gt;
        &lt;option value="All"&gt;Sort By&lt;/option&gt;
        &lt;option value="DESC"&gt;DESC&lt;/option&gt;
        &lt;option value="ASC"&gt;ASC&lt;/option&gt;
      &lt;/select&gt;
    &lt;/div&gt;
  &lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>