How to remove a CSS attribute using jQuery?

There is a DIV with class name home-page-rotater

It has an inline style with width and height I want to remove.

I'm having a challenge trying to find where this code sits. It's for a slide-show on a Drupal site but I can't find where it's hard coded.

So I'm thinking just to remove those two with some jQuery.  What's the best way?
sandshakimiAsked:
Who is Participating?
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

Md ShahCommented:
You can do as below.

Considering sample code for explanation:

HTML:
<div class="testDiv" style="width:500px; height: 100px; background-color: red">

Open in new window

CSS:
.testDiv
{
    width: 50px;
    height: 50px;
}

Open in new window

JQuery:
<script type="text/javascript">
$(document).ready(function(e){
         
        $('div.testDiv').css('width', '').css('height', '');
});
</script>

Open in new window

Look at this - http://jsfiddle.net/mdshahbrains/jhgbH/

Let me know if any issues...

Good Luck !

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
Scott FellDeveloper & EE ModeratorCommented:
Sometimes the code is generated via javascript.    What is the link to  your site?

An easier way is to use css.  Place this at the bottom of your custom css.  Choose one optioin.  The first one, visibility:hidden will retain the shape of the div but hide the contents. display:none will allow the other html to collapse.  

div.home-page-rotater {visibility:hidden;}

Open in new window

div.home-page-rotater {display:none;}

Open in new window

sandshakimiAuthor Commented:
Some reason, the jQuery is not taking on my site.

The site is behind a firewall so I can't share the link, but this site, www.serve.gov, has the exact same slideshow on the home page and the div with class,  home-page-rotater

I suspect the W & H is being dynamically generated, so I want to nix it upon page load completion.
Scott FellDeveloper & EE ModeratorCommented:
>The site is behind a firewall
The easy fix is to push the content to a public url. You can also try and recreated the rendered code to http://jsbin.com/ but that could be a lot more work than necessary.

The serve.gov has their rotator content under the div with id home-rotator.  You may have something completely different.
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
jQuery

From novice to tech pro — start learning today.