diff --git a/article_maker.cc b/article_maker.cc
index 212f9df4..c67c2fb2 100644
--- a/article_maker.cc
+++ b/article_maker.cc
@@ -57,6 +57,9 @@ std::string ArticleMaker::makeHtmlHeader( QString const & word,
     result += "<script type=\"text/javascript\"  "
               "src=\"qrc:///resources/jquery-3.6.0.slim.min.js\"></script>";
 
+    result += "<script>"
+              "var $_$=$.noConflict(true);"
+              "</script>";
     //custom javascript
     result += "<script type=\"text/javascript\"  "
               "src=\"qrc:///resources/gd_custom.js\"></script>";
@@ -70,13 +73,13 @@ std::string ArticleMaker::makeHtmlHeader( QString const & word,
 
   // document ready ,init webchannel
   {
-    // var _JS = { 'jQuery': jQuery.noConflict(true) };
     result += "<script>"
-              " $(document).ready( function (){ "
-              "     console.log(\"document ready,init webchannel\"); "
+              " $_$(document).ready( function ($){ "
+              "     console.log(\"webchannel ready...\"); "
               "     new QWebChannel(qt.webChannelTransport, function "
               "(channel) { "
               "         window.articleview = channel.objects.articleview; "
+              "         articleview.onJsActiveArticleChanged(gdCurrentArticle);"
               "   }); "
               " }); "
               "</script>";
@@ -664,8 +667,8 @@ void ArticleRequest::bodyFinished()
         } else {
           // This is the first article
           head += "<script type=\"text/javascript\">"
-              "var gdCurrentArticle=\"" + gdFrom  + "\"; "
-              "articleview.onJsActiveArticleChanged(gdCurrentArticle)</script>";
+                  "var gdCurrentArticle=\"" + gdFrom  + "\"; "
+                           "</script>";
         }
 
         bool collapse = false;
diff --git a/resources/gd_custom.js b/resources/gd_custom.js
index fdef6edf..18ba1c68 100644
--- a/resources/gd_custom.js
+++ b/resources/gd_custom.js
@@ -1,4 +1,5 @@
-//document ready ,
+//document ready
+(function($){
 $(function() {
         $("a").click(function(event) {
             var link = $(this).attr("href");
@@ -8,10 +9,10 @@ $(function() {
 
             var newLink;
             var href = window.location.href;
-                
+            var index=-1;
             if (link.startsWith("#")) {
                 //the href may contain # fragment already.remove them before append the new #fragment
-                var index = href.indexOf("#");
+                index = href.indexOf("#");
                 if(index>-1)
                 {
                     newLink = href.substring(0, index) + link;
@@ -20,7 +21,7 @@ $(function() {
                     newLink= href+link;
                 }
             } else {
-                var index = href.indexOf("?");
+                index = href.indexOf("?");
                 if(index>-1)
                 {
                     newLink = href.substring(0, index) + "?word=" + link;
@@ -33,10 +34,10 @@ $(function() {
 
         });
 
-    }
+    });
+})($_$);
 
-);
 function playSound(sound) {
-            var a = new Audio(sound);
-            a.play();
-        }
+    var a = new Audio(sound);
+    a.play();
+}