Here is the situation: On my Home page, I have a square 350 x 350px <div> that has a paragraph, and then a "Go" button at the bottom.
When a visitor presses "Go", I used the load() function to instantly load a question with a multiple choice radio button (4 choices) answer. This is all on a <div> located on a separate html page. This is the code I used to do that:
Keep in mind this script is located on the main html page, not the external one that the .load function loads.
So here is what I want to have happen, after a visitor has clicked the "Go" button and it loads up the radio button form, I want the act of clicking on a radio button to load a new <div>, which will contain a new question with a new set of radio button answers.
Here is why I haven't been able to do it:
1. I'm not sure if I write this second script on the main html page, or the external one. If I write it on the main one, it doesn't seem to work because selector that will be effected by the .click() function for the second script is actually located on the external html page (the selector being the input element/radio button).
2. If I put the script on the external html page (thus solving the above problem), now it creates a new problem: the <div> that I want new html loaded onto (in the above code: #callToAction) is now located on the primary html page, as where in this case I would be writing the script on the external html page. So the page doesn't recognize that ID because it doesn't exist on the current page.
Needless to say, I am stumped.
I hope I was able to articulate the problem clearly. If there is any confusion, just ask and I will do my best to clarify.