title: Get href and use as identifier jQuery
body: <p>Currently I am trying to implement a <code>hover</code> effect for an image map. I swap the image on hover, the replcement image have that section of the map filled with a 'hover' color. </p>
  
  <pre><code>&lt;map name="Map"&gt;
      &lt;area id="france" shape="poly" coords="98,133,123,129,151,116,165,129,188,140,181,156,175,167,177,176,181,195,171,203,153,201,145,209,110,196,119,171,110,149,94,141" href="/page/france"&gt;
      &lt;area id="england" shape="poly" coords="94,119,114,115,139,116,150,100,130,69,117,75,119,89,115,106" href="/page/england"&gt;
      &lt;area id="wales" shape="poly" coords="118,87,112,107,99,100,109,86" href="/page/wales"&gt;
      // many more areas //
  &lt;/map&gt;
  </code></pre>
  
  <p>jQuery</p>
  
  <pre><code>$('#england').hover(
      function() {
          $('img').attr('src', '/lib/img/layout/map-en.gif');
      },
      function() {
          $('img').attr('src', '/lib/img/layout/map.gif');
      }
  );
  </code></pre>
  
  <p>It works very nicely. The problem is I have many areas within my image map. Is there a way with jQuery of getting the last part of the href from a link and putting it into a dynamic working variable?</p>
  
  <p><strong>Example logic:</strong></p>
  
  <pre><code>var identifier = area/href/this
  
  $(identifier).hover(
          function() {
              $('img').attr('src', '/lib/img/layout/map-'+identifier+'.gif');
          },
          function() {
              $('img').attr('src', '/lib/img/layout/map.gif');
          }
      );
  </code></pre>