removing some items of a class & keeping others
Hi, I've searched first but haven't found anything to help with this. The scenario is:
I have several conditional select boxes that populate from a database, using .ajax().
When the first select has an onchange, the second select populates normally.
The same goes for the second and third selects.
When I change the value of the second select box, the third box drops all dynamically created options and repopulates.
When I change the value of the first select box, I can only empty the second box and repopulate. The third and future boxes keep their values.
The delete and repopulate piece of my function uses this bit of code:
-
var dynamic_options = $("#" + next_dropdown_ID).children(".dynamic_option");
if ( dynamic_options ){ $("#"+ next_dropdown_ID + " .dynamic_option").remove()};
where next_dropdown_ID is the ID of the child select box. I've played with .find() and .filter() but the results are always either (a) ALL options with this class are removed, including the select I'm currently in, or (b)NO options with this class are removed.
Is it possible to delete ALL options on the page that have the ".dynamic_option" class, except for the children of the select box I'm currently in? I was hoping to be somewhat dynamic about it and not have to write an IF statement for every potential select box, so the code will be reusable. I can post the full function and HTML if more context is needed. Any advice would be great. Thanks!