Option value not changing with user selection
<p>I have a form with the following dropdown selection menu in HTML:</p>

<pre><code>&lt;div class="input-field col s4"&gt;
    &lt;select id="disposition" required&gt;
        &lt;option value="No_Sale" id="noSale"&gt;No Sale&lt;/option&gt;
        &lt;option value="Sale" id="yeahSale"&gt;Sale&lt;/option&gt;
        &lt;option value="Unreachable" id="noContact"&gt;Unreachable&lt;/option&gt;
        &lt;option value="Call_Back" id="callBack"&gt;Call Back&lt;/option&gt;
    &lt;/select&gt;
    &lt;label&gt;Disposition&lt;/label&gt;
&lt;/div&gt;
</code></pre>

<p>The above snippet for dispositions should affect whether or not other form elements are disabled. However, I cannot seem to get the value to change on user input. </p>

<p>Here is the javascript with jQuery: </p>

<pre><code>$(document).on('change', 'select', function(){
    console.log(disposition);
    console.log($("#yeahSale").selected == true);

    if ($("#yeahSale").selected == true) {
        $("#fund").removeAttr('disabled');
    }
});
</code></pre>

<p>For both <code>$("#disposition").val()</code> and <code>$("#yeahSale").selected</code>, the <code>console.log</code> returns </p>

<blockquote>
  <p>"No_Sale"</p>
</blockquote>

<p>and false when I click on the form element and select </p>

<blockquote>
  <p>"Sale."</p>
</blockquote>

<p>The first thing I tried was:</p>

<pre><code>    if (disposition == "Sale")
</code></pre>

<p>I have also tried:</p>

<pre><code>var disposition = $("#disposition").find(":selected").text();
</code></pre>

<p>I've been searching stack exchange and google for answers for almost an hour but I haven't any success so far. My apologies if I just completely missed an extant question that's already been solved. </p>

<p>Thanks for your help!</p>