0

Say I have an example div called test-test which is some pixels wide and some pixels high, and I wish to add its background color using jQuery. Having thought this was very easy in Rails, I'm surprised to see it doesn't work.

My html:

...
<div class="test-test"></div>
...

My test.css.scss:

.test-test {
  width: 300px;
  height: 300px;
}

My test.js file:

 $(".test-test").css("background-color","yellow");

Because a "hello world" test works I know my jquery and asset pipeline is working correctly, it's just changing css attributes that doesn't seem to work. Is there any workaround to this or is it specific to what you want to do in each case? This is just an example so this is not what I really want to accomplish, just so you know.

2
  • Are you running the jQuery code on DOMReady? Is the .test-test div available at that point? Are there any errors in the console? Commented Jan 15, 2015 at 8:00
  • Running it exactly as I wrote here. I don't know why it wouldn't, but then again that's problably the core of my question so I can't answer it. No errors. Commented Jan 15, 2015 at 8:05

1 Answer 1

1

When setting background-color in javascript the property should be named.

"backgroundColor"

so

$(".test-test").css("backgroundColor","yellow");

It's also case sensitive.

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

3 Comments

Doesn't make a difference. I fetched my example from w3schools and I think they have it right.
Ok, but just have another look what they say for "javascript" syntax in the usage & definitions sections ;) Is the code you posted what is returned in the gernerated source? Is the jquery library loaded? Do you have a onDocument load function setup and working?
I suppose it's loaded because I can make it throw an alert to the screen. Don't know what you mean by the last question.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.