JQuery Fade Background Image but not entire div's text

I have the following CSS and HTML. I have the main div's background as an image, I want to fade the image bu not the entire div. When I run the following code the fade entire div fades but I just want the background image to fade not the text "test"
background:url(images/bg_normal.jpg) right top no-repeat;
<link rel="stylesheet" href="includes/css/css.css" type="text/css" />
<script type="text/JavaScript" src="includes/jquery.js"></script>
<script type="text/JavaScript">
jQuery(document).ready(function($) {
		$('#pagewidth').fadeTo("fast", 0.4);
	<div id="pagewidth">
			<div id="wrapper" class="clearfix" > 
			<div id="maincol" >test</div>

Open in new window

Who is Participating?
alien109Connect With a Mentor Commented:
You can't fade just the background of a div tag. Fading will affect the entire element, and all child elements.
To achieve the effect you want, you'll need to place a div inside of pagewidth which is a sibling of the div with the test "test" and then fade that.
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.