I am pretty new to using js on wp and I have this pretty tame script that is supposed to find the element and replace it using textContent. I also am using a simple CSS element that has the same problem. The problem is that they are not working on the admin user-edit page but do work on the user facing profile page that my members have.

The following is the script:

console.log("user-edit js was called")
let deleteText = document.querySelector("label[for='name-here']")
let describeText = document.querySelector(".description")
console.log("Child theme: describe action here")
deleteText.textContent = ""
describeText.textContent = "My new words."

The problem is not in finding the page. When I open the user-edit page, the console correctly logs the messages I have asked, concluding that the problem is not with the enqueueing. But the same query selectors I use on the user facing page logs as "null" here despite having the same exact classes/elements etc.

The error I get is "cannot set properties of null" which makes sense as they are coming up as null.

Even when I try to find other elements, by using id for example, it cannot find them.

One difference I note is if I try to console.log 'document' the user facing page opens up to the entire document and the admin only has a limited document unless I right click and ask it to open in the elements area. If I then console.log 'document.body' I get 'null' in the failed admin area and the body element in the successful user facing area.

I'm not sure what my next step is to debug and figure out the problem here.

  • Is your script enqueued in the head for the footer? If it's enqueued in the head then the document body will not have loaded yet when your script runs. You either need to enqueue the script in the footer, or set your code to run after DOMContentLoaded. Sep 7, 2023 at 3:10
  • Wow thankyou. It was enqueued in the child theme functions.php. I'm not yet sure how to enqueue it in the head or footer, but based on the information/link you provided I was able set it to wait for the DOM to load successfully. Sep 7, 2023 at 23:40


Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Browse other questions tagged or ask your own question.