Try this with your existing div <div id="gold">Gold: 0</div>
:
$('#gold-image').click(function() {
gold++;
$('#gold').html('Gold: ' + gold);
});
Although the above code would work. I would NOT use jQuery for something like this. There are other frameworks which would be way better for such applications. For example you can take a look at AngularJS or Ember.
The same functionality can be achieved using the two-way binding with AngularJS.
1) the markup:
<div controller="GameCtrl">
<img src="/path/to/img.png" ng-click="goldClicked()">
<div>Gold {{ gold }}</div>
</div>
2) the javascript code
app.controller('GameCtrl', function($scope) {
$scope.gold = 0;
$scope.goldClicked = function() {
$scope.gold += 1;
};
});
The code is very very simple and you do not need to deal with selectors. Every time you change the gold (or any other variable) it will automatically be updated in the DOM. You will automatically get modular code and dependency injection. In addition you will write everything declaratively and your code will be much easier to read and easy to change in future.
UPDATE: Here is a working AngularJS fiddle: http://jsfiddle.net/absolutemystery/7WgYK/