title: jquery- onclick find element with same class
body: <p>I'm stuck.  I have two sets of dynamic elements with a common class (<code>zone</code> and <code>box</code>) and a dynamic class:</p>
  
  <pre><code>&lt;span class="zone dynamicClass1 clickable"&gt;Text&lt;/span&gt;
  &lt;span class="zone dynamicClass6-2 clickable"&gt;Text&lt;/span&gt;
  
  &lt;div class="box dynamicClass6-2"&gt;&lt;/div&gt;
  &lt;div class="box dynamicClass1"&gt;&lt;/div&gt;
  </code></pre>
  
  <p>When you mouseover the <code>&lt;span&gt;</code> <code>"zone"</code>, I want to add a class to the <code>&lt;div&gt;</code> <code>"box"</code>.  Then on mouseleave I want the class to be removed.  Thus, something like:</p>
  
  <pre><code>$(document).on("mouseenter",".zone",function(){
      $(this + ".the dynamic class").find(".box.the same dynamic class").addClass("hovered");
  }).on("mouseleave",".zone",function(){
      $(".box.the found dynamic class").removeClass("hovered");
  });
  </code></pre>
  
  <p>The dynamic classes have to be retrieved from the hovered element and then used in finding its match, they cannot be programmed by name.  Any help would be great.</p>