Question

I am reloading a div within my page to reflect variables which have been updated by the user. With my present method the variables are written into the page via a script tag that is imbedded in the body as follows:

JavaScript

cat = 1;

$("a#foo").click(function() {
    cat = cat + 1;
});

$("a#bar").click(function() {
    $('#bat').load('./index.html #bat > *');
});

HTML

<a href="#" id="foo">add another cat</a>

<a href="#" id="bar">update count</a>

<div id="bat">
    <script> document.write(cat); </script>
</div>

Any thoughts or suggestions are much appreciated. And here is a a jsfiddle for your tinkering convenience.

Answer 1

Are you just reloading the page on clicking the link? I would say you do something like this instead of putting a script tag in your .

HTML

<span id="numberOfCats"></span>

Script

$("a#bar").click(function() {
    $('#numberOfCats').text(cat)
});