title: Comparing DOM objects in jQuery
body: <p>I have looked through the other SO posts that seem to be of the same question but they are not.</p>
  
  <p>I have the following:</p>
  
  <pre><code>&lt;table&gt;
    &lt;tr id="first_row"&gt;
      &lt;td&gt;&lt;span id="first_span"&gt;item1&lt;/span&gt;&lt;/td&gt;
      &lt;td&gt;&lt;span&gt;item2&lt;/span&gt;&lt;/td&gt;
    &lt;/tr&gt;
    &lt;tr id="second_row"&gt;
      &lt;td&gt;&lt;span&gt;item1&lt;/span&gt;&lt;/td&gt;
      &lt;td&gt;&lt;span&gt;item2&lt;/span&gt;&lt;/td&gt;
    &lt;/tr&gt;
  &lt;/table&gt;
  </code></pre>
  
  <p>and</p>
  
  <pre><code>jQuery(function() {
    var $a = $("#first_row");
    var $b = $("#first_span").parents("tr");
    var $c = $("#second_row");
  });
  </code></pre>
  
  <p><code>$a</code> and <code>$b</code> are two different jQuery objects but referring to the same DOM object, which <code>$c</code> is a different DOM object but of the same content as <code>$a</code> and <code>$b</code>. How do I compare them so that <strong><code>$a</code> is equal to <code>$b</code> but not to <code>$c</code></strong>? Thanks.</p>
  
  <p>Note: I am fairly new to jQuery and DOM, so hope that I am not making any conceptual mistakes. Feel free to let me know, if any.</p>