How do I confirm deselection of a value in a multiple select field using jQuery?
<p>Let's say that I have a multiple select field like this:</p>

<pre><code>&lt;select id="foodlist" multiple="multiple"&gt;
 &lt;option selected="selected" value="59"&gt;Apple&lt;/option&gt;
 &lt;option value="61"&gt;Orange&lt;/option&gt;
 &lt;option selected="selected" value="1"&gt;Goat&lt;/option&gt;
 &lt;option value="2"&gt;Chicken&lt;/option&gt;
 &lt;option selected="selected" value="46"&gt;Rice&lt;/option&gt;
&lt;/select&gt;
</code></pre>

<p>When an option is selected, no prompt should be given. However, if an option is deselected, I want the user to <code>Confirm</code> their deselection. I started implementing this using jQuery in the <code>change</code> function like this:</p>

<pre><code>$("#foodlist").change(function () {
  //check to see if we are selecting or deselecting an option
  //I only want to do the next step if we are deselecting an option
    if (!confirm("Are you sure you want to remove: " + $(this).text() + "?")) {
        //re-select the option that was deselected because the user changed their mind
    }
});
</code></pre>

<p>My main problem is that the <code>$(this)</code> selector in the change function refers to the entire list when I really want the item that was <strong>clicked</strong> so that I can see if it was selected/deselected and get the value. Is there a jQuery selector for this? How can I do this?</p>
