title: Link simillary name classes so that when one is clicked the other is given a class
body: <p>Basically, I'm asking for a way to optimize this code. I'd like to cut it down to a few lines because it does the same thing for every click bind.</p>
  
  <pre><code>    $("#arch-of-triumph-button").click(function(){
          $("#arch-of-triumph-info").addClass("active-info")
      });
      $("#romanian-athenaeum-button").click(function(){
          $("#romanian-athenaeum-info").addClass("active-info")
      });
      $("#palace-of-parliament-button").click(function(){
          $("#palace-of-parliament-info").addClass("active-info")
      });
  </code></pre>
  
  <p>Is there a way to maybe store "arch-of-triumph", "romanian-athenaeum", "palace-of-parliament" into an array and pull them out into a click bind? I'm thinking some concatenation maybe?</p>
  
  <pre><code>$("+landmarkName+-button").click(function(){
      $("+landmarkName+-info").addClass("active-info")
  });
  </code></pre>
  
  <p>Is something like this even possible?
  Thanks in advance for all your answers.</p>
  
  <p>EDIT: Here's the full HTML.</p>
  
  <pre><code>        &lt;div class="landmark-wrapper"&gt;
              &lt;div class="page-content landmark"&gt;
                  &lt;div class="heading span-after"&gt;
                      &lt;span&gt;Arch of Triumph&lt;/span&gt;
                  &lt;/div&gt;
                  &lt;div class="landmark-button" id="arch-of-triumph-button"&gt;&lt;/div&gt;                 
              &lt;/div&gt;
          &lt;/div&gt;
          &lt;div class="landmark-wrapper"&gt;
              &lt;div class="page-content landmark"&gt;
                  &lt;div class="heading span-after"&gt;
                      &lt;span&gt;Romanian Athenaeum&lt;/span&gt;
                  &lt;/div&gt;
                  &lt;div class="landmark-button" id="romanian-athenaeum-button"&gt;&lt;/div&gt;                  
              &lt;/div&gt;
          &lt;/div&gt;
  
  
  ----------------------------------------------------------
  
          &lt;div class="landmarks-info-wrapper"&gt;
              &lt;div class="landmark-info" id="arch-of-triumph-info"&gt;
                  &lt;div class="info-landmark section"&gt;
                      &lt;span class="landmark-title"&gt;Arch of Triumph&lt;/span&gt;
                      &lt;span class="landmark-coord"&gt;44°28′1.99″N 26°4′41.06″E&lt;/span&gt;
                  &lt;/div&gt;
              &lt;/div&gt;
              &lt;div class="landmark-info" id="romanian-athenaeum-info"&gt;
                  &lt;div class="info-landmark section"&gt;
                      &lt;span class="landmark-title"&gt;The Romanian Athenaeum&lt;/span&gt;
                      &lt;span class="landmark-coord"&gt;44.4413°N 26.0973°E&lt;/span&gt;
  
                  &lt;/div&gt;
              &lt;/div&gt;
  </code></pre>