简体   繁体   中英

Remove CSS Class with JQuery

I have a nested div that gets loaded using PHP include. It gets to put two places, each inside a different parent div.

<div id="parent_div">
    <div id="contact_details_div" class="contact_details_div sameheight">
        <h3>Some Text</h3>
        Some additional Text    
    </div>
    <div id="contact_div" class="contact_div sameheight">
        Even more text
    </div>
</div>

The parent div can be one of two different ID's.

How, using jQuery or just Javascript, can I remove the class 'sameheight' when the parent div is a specific ID name?

This works but removes it from BOTH parent divs.

$( "#contact_details_div" ).removeClass( "sameheight" )
$( "#contact_div" ).removeClass( "sameheight" )

I'm guessing I need an IF statement but, not sure how to write it.

Well, jquery selectors work like css, so you can use a parent child selector: (The following presumes you want the class applied when in #parent_two but not #parent_one :

$( "#parent_one #contact_details_div" ).removeClass( "sameheight" );

However, if the sameheight class is only being used to apply css styles, then it would make more sense to make your css more specific, so it only applies when its a child of the other div:

#parent_two .sameheight{...}

Then you want need the javascript

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM