jQuery , mootools conflict

jQuery.noConflict()

Run this function to give control of the $ variable back to whichever library first implemented it.
jQuery.noConflict() → jQuery

Description:

This helps to make sure that jQuery doesn't conflict with the $ object of other libraries. By using this function, you will only be able to access jQuery using the 'jQuery' variable. For example, where you used to do $("div p"), you now must do jQuery("div p").

NOTE:
This function must be called after including the jQuery javascript file, but '''before''' including any other conflicting library, and also before actually that other conflicting library gets used, in case jQuery is included last. noConflict can be called at the end of the jQuery.js file to globally disable the $() jQuery alias. jQuery.noConflict returns a reference to jQuery, so it can be used to override the $() alias of the jQuery object.

Example:

Maps the original object that was referenced by $ back to $.

jQuery.noConflict();
  // Do something with jQuery
  jQuery("div p").hide();
  // Do something with another library's $()
  $("content").style.display = 'none';
  

Example:

Reverts the $ alias and then creates and executes a function to provide the $ as a jQuery alias inside the functions scope. Inside the function the original $ object is not available. This works well for most plugins that don't rely on any other library.

jQuery.noConflict();
   (function($) { 
   $(function() {
   // more code using $ as alias to jQuery
   });
   })(jQuery);
   // other code using $ as an alias to the other library
  

Example:

You can chain the jQuery.noConflict() with the shorthand ready for a compact code.

jQuery.noConflict()(function(){
   // code using jQuery
   }); 
   // other code using $ as an alias to the other library
  

Example:

Creates a different alias instead of jQuery to use in the rest of the script.

var j = jQuery.noConflict();
   // Do something with jQuery
   j("div p").hide();
   // Do something with another library's $()
   $("content").style.display = 'none';