title: Playing around with jQuery objects and variables
body: <pre><code>    $('div#Settings ul li').click(function () {
          var url, template;
          var self = $(this);
          if (!$(self).hasClass('selected')) {
              var ContextMenu = CreateContext($(self));
              var id = $(self).attr('id');
  </code></pre>
  
  <p>etc...</p>
  
  <pre><code>function CreateContext(item) {
          var ContextMenu = $('div#ContextMenu');
          if (!$(ContextMenu).length) {
              $('&lt;div id="ContextMenu"&gt;&lt;/div&gt;').appendTo('body');
              CreateContext(item);
          }
          $(ContextMenu).slideUp(150, 'swing', function () {
              $(ContextMenu).insertAfter(item);
          });
          $(item).addClass('selected').siblings().removeClass('selected');
          return $(ContextMenu);
      }
  </code></pre>
  
  <p>On the first call to <code>CreateContext(item)</code> I cannot use the variable <code>ContextMenu</code> later in the <code>.click</code> code. However, if CreateContext is called twice, everything works fine. I am getting an undefined variable when i <code>console.log(ContextMenu)</code> the first time. The second time it gets the object correctly. How can I fix this? Thanks.</p>