title: Dynamic context menu Not showing up with jQuery
body: <p>I am working on a Visual Web Editor project.It is a Webpage with a Input text on the top where the user enters website name and the website gets loaded below the input field (Website user can enter are limited to those developed by our firm).</p>
  
  <p>The loaded page is similar to actual website with all anchor links set to "#" and all buttons and form returning false. Means user will stay on the page and cant navigate to the loaded website other pages... </p>
  
  <p>Every element user will hover will get outlined and after clicking the element user will be prompted a list of things he can do with clicked element. <strong>E.g.</strong> if he clicks an image he can either change picture or increase/decrease width/height.  </p>
  
  <p>I am successful in getting the element but unable to get the context menu...it doesn't shows up because loaded pages have their own jquery and that over-rides mine.
  .Firebug says "<strong>TypeError: $.contextMenu is not a function"</strong>  ..
  but it works fine when no website is loaded</p>
  
  <p>I know its a bit confusing to understand that what I really want to say so i am attaching below a snippet of code I am writing. It may help you understand.</p>
  
  <pre><code>&lt;script src="jquery-1.8.2.min.js" type="text/javascript"&gt;&lt;/script&gt;
  &lt;script src="src/jquery.contextMenu.js" type="text/javascript"&gt;&lt;/script&gt;
  
  &lt;script&gt;
  $(function(){
  
    $.contextMenu({
          selector: 'body', 
          trigger: 'left',
          callback: function(key, options) {
              var m = "clicked: " + key;
              window.console &amp;&amp; console.log(m) || alert(m); 
          },
          items: {
              "edit": {name: "Edit", icon: "edit"},
              "cut": {name: "Cut", icon: "cut"},
              "copy": {name: "Copy", icon: "copy"},
              "paste": {name: "Paste", icon: "paste"},
              "delete": {name: "Delete", icon: "delete"},
              "sep1": "---------",
              "quit": {name: "Quit", icon: "quit"}
          }
      }); 
  
   /*  other code goes here */
  &lt;/script&gt;
  
  &lt;body&gt;
  &lt;form method="post" action="crossdomain" id="mzwebsubmit"&gt;
      &lt;input type="text" name="websitename" class="mzweb" value="${websitename }"&gt; 
      &lt;input type="submit" class="mzwebsubmit"&gt;  
  &lt;/form&gt;
  &lt;form method="post" action="crossdomain" id="finalpageform"&gt;
      &lt;input type="hidden" name="finalpage" id="finalpage" class="mzweb" &gt; 
      &lt;input type="submit" value="Save" class="mzweb"&gt;
  &lt;/form&gt;
  
  &lt;hr&gt;
  &lt;hr&gt;
  &lt;!-- Website Loads in this DIV --&gt;
  &lt;div id="visualwebload"&gt;${data }&lt;/div&gt;
  </code></pre>
  
  <p>I am trying it on body so that at-least it should appear anywhere I click, but it doesn't do anything. If I their is no website loaded then it works perfectly. So guys can anyone suggest how can I avoid the issues and get a dynamic contextmenu. All context menu dependencies are included correctly.</p>