Javascript how to get first div element style and change it

Question

I have below html code,

<div id="one">
    <div style="width:100%;height:auto;">
      <div></div>
      <div></div>
    <div>
</div>

Code used:

let parentDivId = document.getElementById('one').children[0];
console.log(parentDivId);

In the above console only i am getting

 <div style="width:100%;height:auto;">
          <div></div>
          <div></div>
  <div>

How to get that first div style using pure java script?

Note: no need to add any id's in the the div's.the above html came dynamical

Need to get the first div with inline styles defined. Also i getting the above html inside a js variable.so document.query selector will not work.Please help me.

Answer 1

document.getElementsByTagName('div')[0].style.backgroundColor = 'RED';

The above code uses vanillaJS

Answer 2

The best way to get first nested div is like: document.querySelector('div div')

Then you can assign styles to it like document.querySelector('div div').style.color = #fff