Help with click events

[hope_industries]

Hey guys, I need help on how to determine a certain variable. I want to be able to dynamicly change the profileID, by clicking on a name or picture. Can anyone give me a hint or even a code fix on how to do this ?

Example: If I click on name or picture, profileID will change to 1 or 2 etc…

Here is the code:

js file:

//global vars
var ownerURL;
var profileID = 0;
var counter = -1;

//Get personal information
$(document).ready(function()
{
    $.getJSON("projectBackEnd.php", function(JSONinfoArr){
        
        //for each getting multiple info from php file
        $(JSONinfoArr).each(function(i, data){
            
            getAllURL(data.owner_profile);
            
            if(i == profileID)
            {
                getURL(data.owner_profile);
            }
        });
    });
    
    function getURL(URL)
    {
        //get xml info
        $.get(URL,{},getInfo,"xml");
    }
    function getAllURL(URL)
    {
        $.get(URL,{},getInfoFriends,"xml");
    }
    
    //function for viewing info
    function getInfo(xml)
    {
        $("project_eigenaar", xml).each(function(){
            
            //Get the info from the xml file
            var eigenNaam = $(this).find('naam').text();
            var geboorteDatum = $(this).find('geb_datum').text();
            var opleiding = $(this).find('opleiding').text();
            var foto = $(this).find('foto').text();
            var projectURL = $(this).find('url').text();
            
            //get the div element
            var profileContain = document.getElementById('profileContain');
            
            //show hide content
            var showName = document.createElement('h3');
            var showNameText = document.createTextNode(eigenNaam);
            profileContain.appendChild(showName);
            showName.appendChild(showNameText);
            
            //foto elements
            var personFotoContain = document.createElement('img');
            var personFotoAttSRCName = document.createAttribute('src');
            var personFotoClassName = document.createAttribute('class');
            var personFotoAltName = document.createAttribute('alt');
            var personFotoHeightName = document.createAttribute('height');
            var personFotoWidthName = document.createAttribute('width');
            
            //foto set nodes
            profileContain.appendChild(personFotoContain);
            personFotoContain.setAttributeNode(personFotoAttSRCName);
            personFotoContain.setAttributeNode(personFotoClassName);
            personFotoContain.setAttributeNode(personFotoAltName);
            personFotoContain.setAttributeNode(personFotoHeightName);
            personFotoContain.setAttributeNode(personFotoWidthName);
            
            //foto node value
            personFotoAttSRCName.nodeValue = foto;
            personFotoClassName.nodeValue = 'profile_foto';
            personFotoAltName.nodeValue = 'profile picture';
            personFotoHeightName.nodeValue = '150';
            personFotoWidthName.nodeValue = '150';
            
            
            //make paragraph elements adn text nodes
            //name
            var personNameContain = document.createElement('p');
            var personName = document.createTextNode(eigenNaam);
            var personNameAtt = document.createAttribute('class');
            personNameAtt.nodeValue = "profile_info";
            //datum
            var personDatumContain = document.createElement('p');
            var personDatum = document.createTextNode(geboorteDatum);
            var personDatumAtt = document.createAttribute('class');
            personDatumAtt.nodeValue = "profile_info";
            //opleiding
            var personOpleidingContain = document.createElement('p');
            var personOpleiding = document.createTextNode(opleiding);
            var personOpleidingAtt = document.createAttribute('class');
            personOpleidingAtt.nodeValue = "profile_info";
            
            
            //fill element with text
            //name
            profileContain.appendChild(personNameContain);
            personNameContain.setAttributeNode(personNameAtt);
            personNameContain.appendChild(personName);
            //datum
            profileContain.appendChild(personDatumContain);
            personDatumContain.setAttributeNode(personDatumAtt);
            personDatumContain.appendChild(personDatum);
            //opleiding
            profileContain.appendChild(personOpleidingContain);
            personOpleidingContain.setAttributeNode(personOpleidingAtt);
            personOpleidingContain.appendChild(personOpleiding);
            
            //loop to get extra information
            $(xml).find('detail').each(function(){
                var detailsName = $(this).attr('type');
                var details = $(this).text();
                
                //get the div element
                var profileContain = document.getElementById('profileContain');
                //table
                var personTable = document.createElement('table');
                var personTableBody = document.createElement('tbody');
                var personTableTR = document.createElement('tr');
                var personTableTR2 = document.createElement('tr');
                var personTableTD = document.createElement('td');
                var personTableTD2 = document.createElement('td');
                var personDetailsName = document.createTextNode(detailsName);
                var personDetails = document.createTextNode(details);
                
                //table style
                var personTableColor = document.createAttribute('class');
                personTableColor.nodeValue = "profile_color";
                personTableTD.setAttributeNode(personTableColor);
                
                //create table
                profileContain.appendChild(personTable);
                personTable.appendChild(personTableBody);
                personTableBody.appendChild(personTableTR);
                personTableTR.appendChild(personTableTD);
                personTableTD.appendChild(personDetailsName);
                personTableBody.appendChild(personTableTR2);
                personTableTR2.appendChild(personTableTD2);
                personTableTD2.appendChild(personDetails);
            });
        });
    }
    
    function getInfoFriends(xml)
    {
        
        $("project_eigenaar", xml).each(function(){
            
            counter ++;
            
            var friendContain = document.getElementById('friends');
            
            //get info from xml
            var friendName = $(this).find('naam').text();
            var friendFoto = $(this).find('foto').text();
            
            //friends maker
            var friendTable = document.createElement('table');
            var friendTR = document.createElement('tr');
            var friendTD = document.createElement('td');
            var friendTD2 = document.createElement('td');
            var friendClick = document.createAttribute('id');
            var friendShowName = document.createTextNode(friendName);
            
            //link elements
            var friendLink = document.createElement('a');
            var friendLinkHR = document.createAttribute('href');
            var friendLinkContent = document.createTextNode(friendName);
            
            //foto elements
            var friendFotoContain = document.createElement('img');
            var friendFotoAttSRCName = document.createAttribute('src');
            var friendFotoClassName = document.createAttribute('class');
            var friendFotoAltName = document.createAttribute('alt');
            var friendFotoHeightName = document.createAttribute('height');
            var friendFotoWidthName = document.createAttribute('width');
            
            //foto set nodes
            friendFotoContain.setAttributeNode(friendFotoAttSRCName);
            friendFotoContain.setAttributeNode(friendFotoClassName);
            friendFotoContain.setAttributeNode(friendFotoAltName);
            friendFotoContain.setAttributeNode(friendFotoHeightName);
            friendFotoContain.setAttributeNode(friendFotoWidthName);
            
            //foto node value
            friendFotoAttSRCName.nodeValue = friendFoto;
            friendFotoClassName.nodeValue = 'profile_foto';
            friendFotoAltName.nodeValue = 'profile picture';
            friendFotoHeightName.nodeValue = '50';
            friendFotoWidthName.nodeValue = '50';
            
            //set table
            friendContain.appendChild(friendTable);
            friendTable.appendChild(friendTR);
            friendTR.appendChild(friendTD);
            friendTR.appendChild(friendTD2);
            friendTD2.setAttributeNode(friendClick);
            friendClick.nodeValue = "changeProfile";
            
            friendTD.appendChild(friendFotoContain);
            friendTD2.appendChild(friendLink);
            friendLink.setAttributeNode(friendLinkHR);
            friendLinkHR.nodeValue = "newProjectViewer.html?mode=profile&id=" + counter;
            friendLink.appendChild(friendLinkContent);
            
        });
    }
});

//Get project information
$(document).ready(function(){
    $.get("projecten_0838000.xml", {}, getProjects, "xml");
    
    function getProjects(xml)
    {
        $("projecten", xml).each(function(){
            
            $(xml).find('project').each(function(){
                var projectName = $(this).find('onderwerp').text();
                var projectOpdrachtGever = $(this).find('opdrachtgever').text();
                var projectLink = $(this).find('link').text();
                var projectTechniek = $(this).find('gebruikte_technieken').text();
                var projectDetails = $(this).find('beschrijving').text();
                
                
                $(this).find('detail').each(function(){
                    var projectDetailName = $(this).attr('type');
                    var projectDetailExtra = $(this).text();
                });
            });
        });
    }
});

php file:

<?php
    
    $host='';
    $username='';
    $password='';
    $db_name='';
    
    //connect to Database
    $db = mysqli_connect($host, $username, $password);
    mysqli_select_db($db, $db_name);
    
    //Get xml file name from database    
    if($result = mysqli_query($db, "SELECT * FROM xml_owner"))
    {
        $SQLinfoArr = array();

        while($row = mysqli_fetch_assoc($result))
        {
            $SQLinfoArr[] = $row;
        }
    }
    
    $JSONinfoArr = json_encode($SQLinfoArr);
    
    echo $JSONinfoArr;
    
?>