I have a "From" dropdown and a "To" dropdown. Both the elements have the same set of options.
I'm trying to take off elements of the 2nd dropdown depending on whatever is selected in the first dropdown. This way I want to eliminate the possibility of ever having the same option in both the "from" and the "to" field. Here's my code:
$(document).ready(function() { $("#from").change(function() { var str = $("#from option:selected").val(); $("#to option[value=str]").remove(); console.log(str); }); });<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <label>From</label> <select id="from"> <option value="Onety One">11</option> <option value="Twenty Two">22</option> <option value="Thirty Three">33</option> </select> <label>To</label> <select id="to"> <option value="Onety One">11</option> <option value="Twenty Two">22</option> <option value="Thirty Three">33</option> </select>This does not seem to be working. Can someone please help me out and let me know what could possibly be wrong with this code.
