Change css property on loading a page using JQuery or JavaScript

Question

How can I setup to change a border-color( css property ) of my .gallery( css class) to white, instead of black, when page loads?

I want this property to be the final, no override by index css file or any other css file.

you can't change your css class via javascript. all you have to do is add different CSS and apply those to your elements conditionally. If you don't want any changes to your element style, either mark your CSS as !important or try inline styles — K D
– K D, Commented Jan 18, 2017 at 9:35
maybe us !important if you are giving it from css, but to be honest what gallery you have there, from where it gets the css? could you not make it custom from there? — Dinca Adrian
– Dinca Adrian, Commented Jan 18, 2017 at 9:36
did you use $('.gallery').attr('style','border-color:black !important') for example — farhadamjady
– farhadamjady, Commented Jan 18, 2017 at 9:39
You can do that directly in your CSS file: .gallery {border-color: red} — Yosvel Quintero
– Yosvel Quintero, Commented Jan 18, 2017 at 9:39
Well, I think there is possibility, because page preloads all css files, and after it, javascript is applied, which means, that we can overrun any css property calling a proper JS code. I was thinking something like $('.gallery').css('border-color', 'red'); but for some reason, it doesn't work. @KD — SamsungBravo
– SamsungBravo, Commented Jan 18, 2017 at 9:40

elysian-design · Accepted Answer · 2023-10-27 07:08:15Z

1

the simplest way would be:

$(document).ready(function() {
  $('.gallery').css('border-color', '#ffffff')
});

This sets the style attribute of your node, overriding any properties from your css (unless they are set to !important)

answered Jan 18, 2017 at 9:38

elysian-design

967 bronze badges

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

Comments

Jathura · Accepted Answer · 2023-10-27 07:14:53Z

0

You can also change border color by adding class

CSS

    .myborder{
      border-color: red;
    }

JS

$(document).ready(function() {
  $('.gallery').addClass('myborder')
});

answered Oct 27, 2023 at 7:14

Jathura

13 bronze badges