title: how to select all elements with matching attribute of this in jQuery?
body: <p>I would like to select all elements within a div that have the same attribute as the selected element, using the <code>this</code> selector.</p>
  
  <p>So in my example, when I click on an element with a class of <code>.foo</code>, I would like to find all elements within <code>.container</code> that share the same <code>data-index</code> attribute as the element that was clicked and then add the class of <code>.bah</code>. Currently the function I have only adds <code>.bah</code> to the element that was clicked on, I understand how to select certain attributes but not in relation to the <code>this</code> selector.</p>
  
  <p>Javascript:</p>
  
  <pre><code>$(document).on('click','.foo', function() {
          $(this).addClass('bah');
  });
  </code></pre>
  
  <p>HTML:</p>
  
  <pre><code>&lt;div class="container"&gt;
    &lt;div class="inner1"&gt;
      &lt;div data-index="0" class="foo"&gt;
        &lt;p&gt;item 1&lt;/p&gt;
      &lt;/div&gt;
      &lt;div data-index="2" class="foo"&gt;
        &lt;p&gt;item 2&lt;/p&gt;
      &lt;/div&gt;
    &lt;/div&gt;
    &lt;div class="inner2"&gt;
      &lt;div data-index="0" class="foo"&gt;
        &lt;p&gt;item 1&lt;/p&gt;
      &lt;/div&gt;
      &lt;div data-index="2" class="foo"&gt;
        &lt;p&gt;item 2&lt;/p&gt;
      &lt;/div&gt;
    &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>