jQuery NoConflict

jQuery NoConflict

Hi all,


But when I call the SPServices utlity with $().SPServices.... , it says $ is not defined. So I did 
var jq=$.noConflict(true); and used jq().SPServices and it worked fine. My form also had button click events utilizing jquery. All of this was working fine. But now suddenly, the functionality inside the button click which contains the jquery is giving error that $ is undefined. I was able to produce a similar issue for demo below.How do i fix it. In below example, when I click on the button, it throws the same error.

  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
  5. <script>

  6. $(document).ready(function(){
  7. LoadData();
  8. });

  9. function LoadData()
  10. {
  11.         $("p").text("jQuery is still working!");
  12.        DisplayComments(); 
  13. }
  14. function DisplayComments()
  15. {
  16.   var j=$.noConflict(true);
  17.   j("p").append("<br>conflict jQuery is still working!");
  18. }
  19. function foo()
  20. {
  21.  $("p").append("<br>jQuery is not recognized here");
  22. }
  23. </script>
  24. </head>
  25. <body>

  26. <p>This is a paragraph.</p>
  27. <button onclick='foo()'>Test jQuery</button>
  28. </body>
  29. </html>