title: Can't get jQuery code to change css dynamically
body: <p>Can't seem to get jQuery to change my css. </p>
  
  <p>In my css file this works...</p>
  
  <pre><code>.closed {
      background-image: url(http://70.55.103.238/Images/menu-collapsed.gif);
  }
  </code></pre>
  
  <p>I need to be able to change this dynamically with jQuery, so I am calling this in my $(document).ready(function()...</p>
  
  <pre><code>$('.closed').css({ 'background-image' : 'url(http://'+window.location.host+'/Images/menu-collapsed.gif)' }); 
  </code></pre>
  
  <p>If it's not obvious, the reason I need to do this is that I cannot use a relative path to the images folder and the host is not a constant. </p>
  
  <p>First question, why is the jquery call not working? If I put an alert like this...</p>
  
  <pre><code>alert('url(http://'+window.location.host+'/Images/menu-collapsed.gif)')
  </code></pre>
  
  <p>I can see that the URL is correct, and if I enter the url displayed in the alert directly into the address bar I do get the gif. So I am confident that the URL being passed is correct. I must assume that the css is not getting changed.</p>
  
  <p>Second question, is there any way to dynamically get the host url in the .css file so that I do not have use jquery?</p>
  
  <p>Thanks.</p>
  
  <p><strong>Update:</strong></p>
  
  <p>I tried the following just to make it simple..</p>
  
  <p>CSS...</p>
  
  <pre><code>.closed {
      background-image: url(../Images/menu-collapsed.gif);
  }
  </code></pre>
  
  <p>javascript...</p>
  
  <pre><code>$('.closed').css({ 'background-image' : 'url(../Images/menu-expanded.gif)' }); 
  </code></pre>
  
  <p>Note that the css is set to use menu-collapsed.gif and the javascript changes it to men-expanded.gif.  But the image that is displayed is the menu-collapsed.gif.</p>