c1b6ecf40163e277df5e8a03490a039bf47f4e6b
chmalee
  Tue Aug 27 10:58:54 2024 -0700
Switch some jquery selectors to document.querySelector so periods can be used in the query, refs #34252

diff --git src/hg/js/utils.js src/hg/js/utils.js
index d2a0bfa..a1435d3 100644
--- src/hg/js/utils.js
+++ src/hg/js/utils.js
@@ -3832,35 +3832,35 @@
         // not a map/area element, maybe from some other part of the UI
         console.log("trying to place a mouseover element next to an element that has not been created yet");
         throw new Error();
     }
 
     // obtain coordinates for placing the mouseover
     let refWidth, refHeight, refX, refY, y1;
     let refRight, refLeft, refTop, refBottom;
     let rect;
     let windowWidth = window.innerWidth;
     let windowHeight = window.innerHeight;
     if (refEl.coords !== undefined && refEl.coords.length > 0 && refEl.coords.split(",").length == 4) {
         // if we are dealing with an <area> element, the refEl width and height
         // are for the whole image and not for just the area, so
         // getBoundingClientRect() will return nothing, sad!
-        let refImg = $("[usemap=#" + refEl.parentNode.name + "]")[0];
+        let refImg = document.querySelector("[usemap='#" + refEl.parentNode.name + "']");
         let refImgRect = refImg.getBoundingClientRect();
         let refImgWidth = refImgRect.width;
-        let label = $("[id^=td_side]")[0];
-        let btn = $("[id^=td_btn]")[0];
+        let label = document.querySelector("[id^=td_side]");
+        let btn = document.querySelector("[id^=td_btn]");
         let labelWidth = 0, btnWidth = 0;
         if (label && btn) {
             labelWidth = label.getBoundingClientRect().width;
             btnWidth = label.getBoundingClientRect().width;
         }
         let imgWidth = refImgWidth;
         if (refEl.parentNode.name !== "ideoMap") {
             imgWidth -= labelWidth - btnWidth;
         }
         let refImgOffsetY = refImgRect.y; // distance from start of image to top of viewport, includes any scroll;
         [x1,y1,x2,y2] = refEl.coords.split(",").map(x => parseInt(x));
         refX = x1 + refImgRect.x;
         refY = y1 + refImgRect.y;
         refRight = x2 + refImgRect.left;
         refLeft = x1 + refImgRect.left;