Atlassian JavaScript Code does not work as expected

Question

AJS.toInit(function () {

$(document).ready(function(){
        console.log("loaded");
var button = document.querySelector('#my-button-id');

console.log(button)

var key = AJS.$("#key-val").text();
var url = "/rest/api/1.0/message/"+key

});

For some reason this javascript Code is always loaded way before the document is fully ready. In my case button is mostly null. Even I use $ (document) . ready function. I have no idea why this is the case..

Nic Brough -Adaptavist- · Answer

Ok, so it's in the wrong place in your app.  I can't tell you any more than the doc you've found does.

Albert Cameron · Answer

$(document).ready(function()

is jquery and should prevent loading my code before the page is fully loaded.

(Right now my code is part of a plugin)

Where should I put my code instead ? Have you got a link ?

I also found this Extending inline edit for JIRA plugins (atlassian.com)

By the way we do not use Jira cloud so far.

Nic Brough -Adaptavist- · Answer

You have added this into the wrong place in the .js load.  When a page loads, it executes all the javascript that says it should run duting load, and the stuff you have is not appropriate when it happens.

I would very very very strongly recommend that you stop wedging js into the wrong places.  If you really do want to run js in places, do it with an app, not a bodge into the screen.