How to update the style of an element within an element using js

Issue

In the javascript below, how would I designate the class btn that exists within the div id = 8?
Also, if I needed to add "!important" to the background color, how would I do that?

html:

<div id="8">
<div class="1">
<div class="2">
<div></div>
<a class="btn">...</a>
</div>
</div>
</div>

js:

$('#8 .btn')[0].style.background = 'white';

Thank you!

Solution

this will probably help

<!DOCTYPE html>
 <html lang="en">
  <head>
   <title>Example</title>
  </head>
  <body style="background-color: red;">
   <div id="8">
    <div class="1">
     <div class="2">
      <div></div>
      <a class="btn">example ban</a>
     </div>
    </div>
   </div>
   <script type="text/javascript">
    
     const collection = document.getElementsByClassName("btn");
     collection[0].style.setProperty("background", "white", "important")
   
   </script>
  </body>
 </html>

Answered By – Luis Martinez

Answer Checked By – Mary Flores (AngularFixing Volunteer)

Leave a Reply

Your email address will not be published.