← Back to Upcase

Change a div bgColor with Javascript


(Derrick Lannaman) #1

Hi Community,
first-time post :slight_smile:
#####Here is the scenario:
I’m trying to change the bg color of a div, depending on the content in the div.

Here is the code in the view:

@received_stories.each do |recvd_story|    
          .....do stuff

.bottom_story_info   
 = recvd_story.get_status

The content is added from the get_status method in the model

def get_status

return @private = "Private" if self.shares.nil? || self.shares.empty?
return @public = "Public" if self.shares.include?('facebook')
return @shared = "Shared"

end

Here’s my JS:

var story_status = document.getElementsByClassName('bottom_story_info')

var status = ""

for (var i = 0; i < story_status.length; i++) {
status = story_status[i].innerText;
if (status == "Private"){
// I want to do something like this....

  $(this).addClass('private_status');
   }
  else if (status == "Shared") {
  // when I do this...
  $('.bottom_story_info').addClass('shared_status')
  // it changes the class for all 
  $(this).addClass('shared_status');
  }
  else {
  // .........
  }
}

So, the background-color should change depending on the inner text contents. Maybe I’ve been wrestling with this for too long because I can’t see the error. Hope this was clear.


(Derrick Lannaman) #2

I figured it out. Thanks anyway.