How to change CSS with Javascript in Sololearn?!

Question

Does anybody know how to manipulate css in the JavaScript window of the code playground without jQuery?
Everytime i run a code where style manipulation is involved it pops an error saying "cannot read property style of null"... 🤔
thanks in advance..

Answer 1

//Make sure the "document" object has loaded first...

onload = function() {
document.body.style.background = "red"
};

Answer 2

wrap your code in an onload. the js tab is injected in the head before the body so the code runs prior to the DOM of the body being created and the elements within it won't exist.

window.onload = function() {
.... code here
};

Answer 3

my code that used DOM without JQuery
just for your reference, not for advertising
https://code.sololearn.com/WH3xv416vBM9/?ref=app

Answer 4

Then you should be able to point that buttons onclick to the function you wish to run when the button is click. Just make sure that you initialize the variables that contain the elements you wish to effect within the body of that function. If this doesn't help then please post your code so that we can see where the problem lies. I'm about to leave for work so hopefully you get it resolved.

Answer 5

@ChaoticDawg but i want my js code to execute after clicking on a button in the dom not before

edit: i found a solution if the js code is related to a dom element's event you gotta put the js code in the script tag inside the body in the html tab

Answer 6

Thanks!