I have a page that initially is generated by php. On the first interaction by the user, a basic modal window is generated.

A side question: I could easily generate this modal window code and set it hidden in the php, instead of generating it via js. Is there any advantages in doing this? Is that the normal practice? I am new to this and don't really know the "normal" way to do it.

Anyways back to the problem:

In the modal window, there are 2 drop down lists. The first list (parent list) is a list of predefined categories. The second is a list (children list) of sub-categories based on the the first list's choice. The sub-categories are retrieved by an ajax call.

Now i want to initally just show category 1 and its subcategories as sort of a default setting, which is working. The other subcategories i need to store, so when the parent list is changed, i can retrieve show the correct subcategories. Can i store data in the script from the responseText? I tried a global variable with no luck.

Any help will be much appreciated! Below is the ajax function that handles the response.

function retrieve_work_details(subset)
  var myscript = "work_activities.php";
  var params = "subset="+subset+"&status"+"active";
  http.open("POST", myscript, true);

  http.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
  http.setRequestHeader("Content-length", params.length);
  http.setRequestHeader("Connection", "close");

  http.onreadystatechange = function(){
    if(http.readyState == 4 && http.status == 200)
      var data = (http.responseText).split("#");
      var daily_act = data[0].split("|");

      for(var i = 0; (i < daily_act.length) && (daily_act[i].length > 0); i++)
        my_info = daily_act[i].split(",");
        var optn = document.createElement("Option");
        optn.value = my_info[0];
        optn.text = my_info[1];

      activities = data; //global variable