html - How to set css to a specific selector using jQuery -


consider following html:

<div class="bl-dark separator">     <div class="bl-icon-wrapper">         <div class="bl-icon-border"></div>         <div class="bl-icon-scale-bg dark"></div>         <div class="bl-icon-background"></div>         <div class="bl-icon-dark icon"></div>     </div> </div> 

when click occurs user, selector bl-icon-wrapper have class added using jquery, updated html be:

<div class="bl-dark separator">     <div class="bl-icon-wrapper selected">         <div class="bl-icon-border"></div>         <div class="bl-icon-scale-bg dark"></div>         <div class="bl-icon-background"></div>         <div class="bl-icon-dark icon"></div>     </div> </div> 

now in css have selector filled:

.selected .bl-icon-scale-bg {      // want css added .js here } 

i don't want .bl-icon-scale-bg want this specific selector (.selected .bl-icon-scale-bg) filled.

if wanted add css .bl-icon-scale-bg can .find(), can't specific 1 filled.

the reason why want value of css vary depending on viewport. since requires math values can't calculated simple calc function in css, using jquery required. if there isn't way fill specific css jquery guess have go around other jquery functions.

instead of adding css file should change css using following:

$(".selected .bl-icon-scale-bg").css("prop", "value");  

Comments

Popular posts from this blog

php - Wordpress website dashboard page or post editor content is not showing but front end data is showing properly -

How to get the ip address of VM and use it to configure SSH connection dynamically in Ansible -

javascript - Get parameter of GET request -