Using a global variable within a function

Hi all,

I'm trying to learn how to use global variables, but can't quite get it right:

Im trying to use two buttons, named UpButton and DownButton to control one global variable, p1

A text field, named "Value" displays p1.

Here's my code:

p1 = 0;

ButtonClick("UpButton", p1, 100,"Value");

ButtonClick("DownButton", p1,(-100),"Value");

function ButtonClick(ButtonName,Var,Increment,TextToChange){

                    sym.$(ButtonName).click(function(){

                    Var = Var + Increment;

                    sym.$(TextToChange).html(Var);

          });

}

However, it seems to be treating p1 as two different variables.

Here's a link to the page to show you what I mean, apologies but this link wont work in google chrome because I'm using dropbox as a server temporarily

In other browsers you may need to click "Show all content" or similar to any security warnings...

https://dl.dropboxusercontent.com/u/83693404/ButtonTest/buttons.html

Here are the project files:

https://app.box.com/s/0shocivto8fl295h62uq

Any help greatly appreciated, sorry if this is a stupid question,

Katherine