title: How to solve a conflict with primefaces jquery
body: <p>Im developing a project with primefaces 5,  one page uses a js file that needs jquery, but shows <code>Uncaught TypeError: undefined is not a function</code>, but when I change my jquery source from <code>&lt;h:outputScript library="primefaces" name="jquery/jquery.js" target="head"/&gt;</code> to  </p>
  
  <pre><code>&lt;h:head&gt;
      &lt;script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.min.js"&gt;&lt;/script&gt;
        &lt;script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.10/jquery-ui.min.js"&gt;&lt;/script&gt;
  &lt;/h:head&gt;
  </code></pre>
  
  <p>works fine but I lost many primefaces features like <code>contexMenu</code></p>
  
  <p>How can I solve this conflict?</p>
  
  <p>This is my javascript file:</p>
  
  <pre><code>(function($, $S) {
  //$ jQuery
  //$S window.localStorage
  //Variables Declaration
  var $board = $('#notesForm\\:board'),
  //Board where the Posticks are sticked
  Postick, //Singleton Object containing the Functions to work with the LocalStorage
  len = 0, //Length of Objects in the LocalStorage
  currentNotes = '', //Storage the html construction of the posticks
  o; //Actual Postick data in the localStorage
  
  //Manage the Posticks in the Local Storage
  //Each postick is saved in the localStorage as an Object 
  Postick = {
      add : function(obj) {
          obj.id = $S.length;
          $S.setItem(obj.id, JSON.stringify(obj));
      },
  
      retrive : function(id) {
          return JSON.parse($S.getItem(id));
      },
  
      remove : function(id) {
          $S.removeItem(id);
      },
  
      removeAll : function() {
          $S.clear();
      }
  
  };
  
  //If exist any postick, Create it/them
  len = $S.length;
  if (len) {
      for (var i = 0; i &lt; len; i++) {
          //Create all posticks saved in localStorage
          var key = $S.key(i);
          o = Postick.retrive(key);
          currentNotes += '&lt;div class="postick"';
          currentNotes += ' style="left:' + o.left;
          currentNotes += 'px; top:' + o.top;
          //data-key is the attribute to know what item delete in the localStorage
          currentNotes += 'px"&gt;&lt;div class="toolbar"&gt;&lt;span class="delete" data-key="'
                  + key;
          currentNotes += '"&gt;x&lt;/span&gt;&lt;/div&gt;&lt;div contenteditable="true" class="editable"&gt;';
          currentNotes += o.text;
          currentNotes += '&lt;/div&gt;';
      }
  
      //Append all the posticks to the board
      $board.html(currentNotes);
  }
  
  //When the document is ready, make all posticks Draggable
  $(document).ready(function() {
      $(".postick").draggable({
          cancel : '.editable',
          "zIndex" : 3000,
          "stack" : '.postick'
      });
  });
  
  //Remove Postick
  $('span.delete').live('click', function() {
      if (confirm('Are you sure you want to delete this Note?')) {
          var $this = $(this);
          //data-key is the attribute to know what item delete in the localStorage
          Postick.remove($this.attr('data-key'));
          $this.closest('.postick').fadeOut('slow', function() {
              $(this).remove();
          });
      }
  });
  
  //Create postick
  $('#notesForm\\:btn-addNote')
          .click(
                  function() {
                      $board
                              .append('&lt;div class="postick" style="left:20px;top:70px"&gt;&lt;div class="toolbar"&gt;&lt;span class="delete" title="Close"&gt;x&lt;/span&gt;&lt;/div&gt;&lt;div contenteditable class="editable"&gt;&lt;/div&gt;&lt;/div&gt;');
                      $(".postick").draggable({
                          cancel : '.editable'
                      });
                  });
  
  //Save all the posticks when the user leaves the page
  window.onbeforeunload = function() {
      //Clean the localStorage
      Postick.removeAll();
      //Then insert each postick into the LocalStorage
      //Saving their position on the page, in order to position them when the page is loaded again
      $('.postick').each(function() {
          var $this = $(this);
          Postick.add({
              top : parseInt($this.position().top),
              left : parseInt($this.position().left),
              text : $this.children('.editable').text()
          });
      });
  }
  })(jQuery, window.localStorage);
  </code></pre>