title: How to assign a different ID to every auto-generated button?
body: <p>I use Facebook API to get all groups from user and then another function with FQL to make a different div for each group, and assign to each div a button, which links to another page, something like:</p>
  
  <pre><code>$('.groupButton').click(function() {  
    window.location ='anotherpage.html?groupid=' + groupid;
  });
  </code></pre>
  
  <p>But on every button it assigns the last button's groupid.
  I don't know where's the mistake.</p>
  
  <p>The 2 functions: </p>
  
  <pre><code>        function getGroupsIds(){
              document.getElementById('content_text').innerHTML = "";
              FB.api('/me/groups',function(resp){
                  for (var i=0, l=resp.data.length; i&lt;l; i++){ 
                  getGroupInfo(resp.data[i].id);
                  }
              });
          }
  
  
          function getGroupInfo(groupid){
              FB.api({
                  method: 'fql.query',
                  query: 'Select name, description, gid, pic_cover from group where gid=' + groupid
              }, function(resp){
                  var content_text = document.getElementById('content_text');
                  var group = new Array(); 
                  for (var i=0, l=resp.length; i&lt;l; i++) 
                  {
  
  
                      groupinput = document.createElement('button');
                      groupinput.className = "groupButton";            
                      groupinput.innerHTML = "Vizualise";
  
                      $('.groupButton').click(function() {  
                      window.location ='pages/appviz.html?groupid=' + groupid;
                      });
  
  
                      groupdiv.appendChild(groupinput);
                      content_text.appendChild(groupdiv);
  
                  }
              });
      }
  </code></pre>