Changing css background with javascript

Question

I want to use js to change the background color that is set to white in the css. Not sure why nothing is happening.

.html

<body>
  <div class="invoice-box">
    <table cellpadding="0" cellspacing="0">
      <tr class="top">
        <td colspan="2">
          <table>
            <tr>
              <td class="title">
                <img src="emoji.png" width="100">
              </td>

.css

.invoice-box {
  background: white;
  max-width:800px;
  margin:auto;
  padding:30px;
  border:1px solid #eee;
  box-shadow:0 0 10px rgba(0, 0, 0, .15);
  font-size:16px;
  line-height:24px;
  font-family:'Helvetica Neue', 'Helvetica', Helvetica, Arial, sans-serif;
    color:#555;

.js

document.getElementById("invoice-box").style.background = "red";

Let Me Tink About It · Accepted Answer · 2017-09-24 04:58:40Z

1

If you can use jquery just do as sample

$('#element').css('background-color', '#ffffff')

Note: #ffffff = white color

edited Sep 24, 2017 at 4:58

Let Me Tink About It

16.3k23 gold badges109 silver badges221 bronze badges

answered Sep 24, 2017 at 4:54

user3608996

112 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Karan Desai · Accepted Answer · 2017-09-24 04:50:02Z

0

You have used getElementById which fetches html elements from Id, but you have defined invoice-box as class. Define it to id as well

<body>
<div class="invoice-box" id="invoice-box">
    <table cellpadding="0" cellspacing="0">
        <tr class="top">
            <td colspan="2">
                <table>
                    <tr>
                        <td class="title">
                            <img src="emoji.png" width="100">
                        </td>

answered Sep 24, 2017 at 4:50

Karan Desai

3,2026 gold badges39 silver badges69 bronze badges

Comments

kyun · Accepted Answer · 2017-09-24 04:50:55Z

0

document.querySelector(".invoice-box").style.background = "red";

How about using querySelector?

answered Sep 24, 2017 at 4:50

kyun

10.4k9 gold badges36 silver badges79 bronze badges

Comments

Deepu Cherian · Accepted Answer · 2017-09-24 04:57:19Z

0

you are using class and calling id in the javascript, use instead of class

answered Sep 24, 2017 at 4:57

Deepu Cherian

1379 bronze badges

Collectives™ on Stack Overflow

Changing css background with javascript

4 Answers 4

Comments

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related