title: change the background image of one div when the mouse is over a different div
body: <p>I want to change the background image of one div when the mouse is over a different div, using jQuery.</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>jQuery(function() {
    jQuery('.linktomouseover').mouseover(function() {
      $(.linktomouseover2).css('background-image', "url('test.jpg')");
    });
  });</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"&gt;&lt;/script&gt;
  &lt;div class="linktomouseover"&gt;
    &lt;a class="nthn"&gt;link1&lt;/a&gt;
  &lt;/div&gt;
  &lt;div class="linktomouseover2"&gt;
    &lt;a class="test"&gt;link2&lt;/a&gt;
  &lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>So when mouse is over div with class <code>linktomouseover</code> it will actually change the background of div with class <code>linktomouseover2</code></p>
  
  <p>this does not seem to work. please help?</p>