Using .load() to load up images

Using .load() to load up images

Hi all,

I tried creating a small widget that when a user clicks on one of the 4 buttons (links), instead of it taking the user to a new page it will load a specific div from another page is the div container above it. 

HTML (excerpt):

<div imagePane></div>

      <div buttonLinks>
            <ul>
                  <li class="button1"><a>BUTTON 1</a></li>
                  <li class="button2"><a>BUTTON 2</a></li>
                  ...etc
            </ul>
      </div>

JS:
$('.button1').click(function(){
$('#imagePane').load('path/to/other/file.html #button1-image');

The problem I'm having is that the content of the other page's div container loads, but that actual image that I set as the background does not.

I attempted to use .load() to serve up an image instead, $('#imagePane').load('path/to/graphic.jpg'); but that didn't seem to work at all. Is there another function for this type of thing?