jQuery noconflict()

Used to relinquish control of the $ variable.
By default jquery uses $ as a shorthand for the jQuery object, but this can conflict with other JavaScript libraries that may also use the $ symbol.
It prevents the conflict with other javascript libraries.


<!DOCTYPE html>
<html lang="en">
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>jQuery noConflict Example</title>
  <script src="https://code.jquery.com/jquery-3.6.4.min.js"></script>

<div id="exampleElement">This is an example element.</div>

  // Using $ as a shortcut for jQuery
  $(document).ready(function() {
    $("#exampleElement").css("background-color", "lightyellow");

  // Releasing control of the $ variable
  var jq = $.noConflict();

  // Using jq as a replacement for $
  jq(document).ready(function() {
    jq("#exampleElement").css("color", "blue");

  // Using $ again (outside the noConflict scope)
  $(document).ready(function() {
    $("#exampleElement").css("border", "2px solid red");


Quick Recap - Topics Covered

jQuery noConflict()

Practice With Examples in Compilers

The Concepts and codes you leart practice in Compilers till you are confident of doing on your own. A Various methods of examples, concepts, codes availble in our websites. Don't know where to start Down some code examples are given for this page topic use the code and compiler.

Example js

Example 1 Example 2 Example 3 Example 4 Example 5