Jquery duplicate dynamic checkboxes not working

I am creating dynamic forms inside each game fixture so they can invite players. When creating the team sheet I take the name and create a list.

/* Get team players information */
                    if (data.team_members){
                        $.each(data.members,function(index,item){
                            if (data.r_id <= 2){
                                members += '<tr class="refresh"><td style="padding: 0.20em;">'+
                                '<a href="#">'+item.forename+'  '+item.surname+'</a>'+
                                '</td><td style="padding: 0.20em;">'+item.role;
                            }else{
                                members += '<tr class="refresh">'+
                                    '<td style="padding: 0.20em;">'+item.forename+' '+item.surname+'</td>'+
                                    '<td style="padding: 0.20em;">'+item.role;
                            }
                            if (item.r_id == 3){
                                invite += '<li>'+item.forename+' '+item.surname+
                                    '<input type="checkbox" id="check'+i+'" name="invites[]" value="'+item.p_id+'" checked/>'+
                                    '<label style="float:right;" for="check'+i+'">&nbsp;</label></li>'; 
                            i++;
                            }
                            members += '</td></tr>';

                        });
                        $("#team_list > tbody:last-child").append(members);
                    }

The trouble is the checkboxes, I create a var invite and all the names of the players go into the variable. Later in the code I add the dynamic form

f +='</center></td></tr><tr><td class="invite_form-'+i+'" style="display:none;">'+
                                    '<form id="iForm'+i+'" name="addIForm'+i+'"><ul class="alt">'+invite+'</ul>'+
                                    '<a href="#" id="submitInvite'+i+'" class="button submitInvite fit small">Submit</a>'+
                                    '</form></td></tr>';
                                i++;
                            }

The page loads and I can open the forms. The first form works and i can click the checkboxes. When I open the second form, the checkboxes click for the first form.

I am assuming its because of the checkbox id's. Has anybody come across this issue before.