how to test if two elements are the same
<p>I have a list of items that can be hidden/unhidden via JS be clicking them.  The currently open item is stored in a variable, <code>openActivity</code>.  Only one item can be opened at a time.  I want to check in the click() event whether the clicked item is the same as the already opened item, so that it does not do a double-animation of it closing and then opening.  I would suspect this to work at first:</p>

<pre><code>if (openActivity == $(this)) alert('hello');
</code></pre>

<p>But it does not.  I noted this does not work either:</p>

<pre><code>if ($(this) == $(this)) alert('hello'); //never alert()s !
</code></pre>

<p>Here's all most relevant code, if it's worth anything to you (you may not have to look at this):</p>

<pre><code>openActivity = null;
$('.activityOuterContainer').click(function () {
    if (openActivity !== null) {
     if (openActivity == $(this)) alert('hello');
     activityExtra(openActivity).slideUp();
     activityToggle(openActivity).css('background-position', '0 0');
    }
    openActivity = $(this);
    activityExtra(openActivity).slideDown();
    activityToggle(openActivity).css('background-position', '0 -20px');
});


function activityToggle(a) {
    return a.closest('.activityOuterContainer').find('.activityToggle');
}
function activityExtra(a) {
    return a.closest('.activityOuterContainer').find('.activityExtra');
}
</code></pre>

<p>And one of the items:</p>

<pre><code>&lt;div class="activityOuterContainer"&gt;
    &lt;div class="activityContainer"&gt;
     &lt;div class="activityFormContainer"&gt;
      name here
      &lt;div class="activityExtra"&gt;
       &lt;p&gt;extra&lt;/p&gt;
      &lt;/div&gt;
     &lt;/div&gt;
     &lt;div class="activityIsUsed"&gt;checkbox here&lt;/div&gt;
    &lt;/div&gt;
    &lt;div class="activityToggle"&gt;&lt;/div&gt;
&lt;/div&gt;
</code></pre>
