title: Preserve variables in a javascript closure function
body: <p>I am pretty much a novice in javascript programming and i would really need some help/advice.</p>
  
  <p>What i am trying to do:
  I have a function (or object?!) which looks like this:</p>
  
  <pre><code>var svgInteraction = function (containerId) {
      var svgNamespace = "http://www.w3.org/2000/svg",
          htmlns = "http://www.w3.org/1999/xhtml",
      mathns = "http://www.w3.org/1998/Math/MathML";
  
      svgInteractions = {};
  
      svgInteractions[containerId] = "I am " + containerId;
      console.log(svgInteractions);
  
      return function () {
          console.log(svgInteractions);
      }
  };
  </code></pre>
  
  <p>i initialize a variable like this:</p>
  
  <pre><code>var svg1 = svgInteraction("container_1");
  var svg2 = svgInteraction("container_2");
  </code></pre>
  
  <p>The problem is that, for each initialization of the svgInteraction, the svgInteractions objects reinitialize.</p>
  
  <p>It outputs:</p>
  
  <pre><code>Object { container_1="I am container_1"}
  Object { container_2="I am container_2"}
  </code></pre>
  
  <p>Is there any way to keep old values inside it?</p>
  
  <p>Thank you</p>