Background: I have a function which I wrote, which allows me to select an option from one list and set the default selection of another list. (See the code file attached). This file works really well, perfectly as a matter of fact.
When I try and run this jQuery function on a Wordpress Site using the exact same "Element ID's" and code from the attached HTML file, it completely fails.
What I have tried so far:
1. I have tried to place the code inside the body of the page, the header of the page as well as the footer. Nothing worked.
2. I have tried to change the element ID's, nothing.
3. When I am logged into Wordpress and I select an option, and refresh the page, the selection works, but only after REFRESHING the page.
4. I have tried to debug the Wordpress page in question, but to no avail, the code just does not work there. There is not anything to debug - it just won't work. What am I missing?
5. I know I am using the right element id's because when I use the code from the attached jqsnippet.txt file, it tells me which element value I have selected, when I select it.
6. Also, I need to have completely autonomous code, because I am manipulating values from the "Post Type Builder" plugin. Should not matter however, I should be able to type TWO ELEMENT ID's into the function and be off to the races. I just need to get the existing function, or something similar to work in my Wordpress site.
The WordPress page in question is here: http://www.wjdoe.com/firstowner/testing/
jQuery/JS Element Finder:
HTML That Works
If anyone could please help me with this, it would be much appreciated. I am essentially pulling my hair out, at this point. The solution to this is probably trivial, but I could use all of the help I can get. I am not looking for the complete answer here, just a place to start. A complete answer would be nice, just not expected ;)