communication between an iframe and the page its part of through javascript in ie8

I have seen many questions like this but have not found anything that seems to help with my specific situation so I apologize if this question seems repetitive.

I have a site www.foo.com and have an iframe in it. When information I click on an a tag in foo.com a javascript function is called that passes a new image to the iframe to show the user. The communication between iframe and its "parent" seems to work fine on all browsers EXCEPT RANDOM IE8 PAGES. I get the following error message "access is denied" and the browser points to the function that has been activated. Following is a piece of code from the site to see how it works.

the iframe:

<iframe scrolling="no" src="foo.com/bar" id="ifram" name="ifram"></iframe>

the a tag:

The javascript:

if($(this).val() == '242'){

    document.getElementById('ifram').style.border='0px';

    document.getElementById('ifram').style.background = "url('../product_images/uploaded_images/Flag.jpg')";

    document.frames.ifram.document.body.style.backgroundColor="transparent";

This is just a snippet of a code and does not include the whole process of the ajax call to get the image but was not sure if the ajax is part of the issue. I get an undefined error in firefox but the function still fires . I am assuming I would just need to use window.frames for firefox.

Overall, any help on how to resolve this issue would be appreciated. I am wondering if there is a security issue that has to do with browser settings or if its part of how I coded.

Thanks in advance