Applying gray background on HTML

I have a HTML code where I’m trying to apply a gray background on HTML with JavaScript.

The body contains two divs with the wrapper class. On ul with the ID liste1 and liste2 for the second. Each of my ul contains 4 <li> items.

I tried the following script but it did nothing:

  <script>
    //When the page loads, apply the fondgris class to all li elements.
    var liste1 = document.getElementById("liste1");
    for (var i = 0; i < liste1.children.length; i++) {
        liste1.children[i].className = "fondgris";
    }
    
  </script>

Also I called my script in the header of my .html file. Should I add a function to make the code work?