Question

I am dynamically creating forms dynamically according to a users actions. It is an entry-box and a two “buttons” for each instance. Each instance will be wrapped in a unique div tag.

What I tried to do without success is when I dynamically create the “button” I attach a function with the input variable containing the div of its instance. This a brief excerpt:

  var newDivClass = document.getElementById("instance"+1);
  button1.innerHTML = "<a href=\"#\" onclick=\"buttons("+newDivClass+");\" id=\"button1\"> Button1 </a>";

  function buttons(selected) {
        //I want this to select the first instance 
        //of button1 found within div newDivClass
        selected.getElementById("button1");
        //I also tried
        //this.getElementById("button1");
        //selected.getChildren[0]; 
  }

The problem appears to be in passing newDivClass to the the actual function.

Answer 1

If your intent is to pass the name of the object as a string and not a reference to the object itself, then you would need to have enclosing quotes around the newDivClass variable:

button1.innerHTML = "<a href=\"#\" onclick=\"buttons('"+newDivClass+"');\" id=\"button1\"> Button1 </a>";

Otherwise the script in your buttons function will be attempting to operate on an object with the id “instance*n*” at the top level of the dom.