removing body background color of iframe

I have a an iframe on my page that currentlyhas a background color of grey, I want to change the color to be white but cant seem to do it. I have tried using jquery but not sure if this is correct:

$(document).ready(function(){
    $('iframe').contents().find('body').css('backgroundColor', 'white');
});

basically at the moment the bo tag within the iframe has the inline background-color: #f1f0e9

can anyone suggest how I can update this background color? i've tried css also but nothing.

The problem is on this page http://cromorevillage.com/book.html

The iframe is th开发者_运维问答e booking element and the background color of this extends down the page because an iframe height had to be added to allow for all booking options to be shown when selected?

My comment...

Does the src attribute of the iframe have matching domain, protocol and port to its parent page?

Your response...

No the iframe is external.

The reason you can not change it is because of Same Origin Policy.

$(document).ready(function(){
    $('iframe').contents().find('body').attr('bgcolor', 'white');
});

.css('background-color', 'white');

background-color is the css style you are looking for.

You need to add a P3P header with the value of CP="CAO PSA OUR" to allow cross-domain interfacing.