Try it Yourself: jQuery noConflict

jQuery noConflict

<!DOCTYPE html>
<html>
<head>
  <script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
</head>
<body>

<button>Click me</button>
<p>This paragraph will change when the button is clicked.</p>

<script>
$.noConflict();
jQuery(document).ready(function () {
  jQuery("button").click(function () {
    jQuery("p").text("jQuery still works using its full name.");
  });
});
</script>

</body>
</html>

<!DOCTYPE html>
<html>
<head>
  <script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
</head>
<body>

<button>Click me</button>
<p>This paragraph will change when the button is clicked.</p>

<script>
$.noConflict();
jQuery(document).ready(function () {
  jQuery("button").click(function () {
    jQuery("p").text("jQuery still works using its full name.");
  });
});
</script>

</body>
</html>