title: jQuery: How to determine the parent container element id
body: <p>I am trying to obtain the id of the container whose href element was clicked, using jQuery. I know this involves use of the parent() method, but I'm not sure how to put it all together.</p>
  
  <p>Here is a snippet of the kind of HTML doc I will be processing:</p>
  
  <pre><code>&lt;html&gt;
      &lt;head&gt;
      &lt;script type="text/javascript" src="jquery.js"&gt;&lt;/script&gt;
      &lt;/head&gt;
      &lt;body&gt;
          &lt;div id="cntnr_1" class="container"&gt;
               &lt;a href="/foo1"&gt;foo1&lt;/a&gt;
               &lt;a href="/foo2"&gt;foo2&lt;/a&gt;
               &lt;a href="/foo3"&gt;foo3&lt;/a&gt;
          &lt;/div&gt;
          &lt;div id="cntnr_2" class="container"&gt;
               &lt;a href="/foobar1"&gt;foobar1&lt;/a&gt;
               &lt;a href="/foobar2"&gt;foobar2&lt;/a&gt;
               &lt;a href="/foobar3"&gt;foobar3&lt;/a&gt;
          &lt;/div&gt;
          &lt;script type="text/javascript"&gt;
          $().ready(function(){
              //display the url of the clicked on link
              //display the id of the container whose href was clicked on     
          });
          &lt;/script&gt;
      &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>The desired behavior (When a link [href] in a "container" is clicked) is as follows:</p>
  
  <ol>
  <li>Display the link of the url clicked on (so I can submit an AJAX POST to the url)</li>
  <li>Display the id of the container (so I can push the received data back to that id)</li>
  </ol>
  
  <p>Can anyone help with how to obtain the parent container id and the url that was clicked?</p>
  
  <p><strong>[[Edit]]</strong></p>
  
  <p>I have posted the actual HTML code I am using here: <a href="http://jsfiddle.net/fpPRL/" rel="nofollow">http://jsfiddle.net/fpPRL/</a></p>