Object.style.x Doesn't Return Anything

In JavaScript on my website I have something like this: console.log(document.getElementById('side_news').style.display); and I have tried this with a lot of styles and it doesn't

Solution 1:

Try using getComputedStyle():

var sideNewsDiv = document.getElementById('side_news');
getComputedStyle(sideNewsDiv).getPropertyValue("display");

MDN documentation:Window.getComputedStyle().

Solution 2:

Most elements don't show all of their attributes when accessing through object.style. A div element has a default display style of block but accessing it through style will result an empty value.

A solution is to use getComputedStyle - or, if not supported by the browser, currentStyle.

if (window.getComputedStyle)
    status = window.getComputedStyle(targetElement, null);
else
    status = targetElement.currentStyle;

This will show the element's style with all the css changes.