title: How to get one iframe to close after opening another iframe using Jquery
body: <p>I have 2 iframes on a careers page for a site, the client has supplied me to iframes from which their open positions populate from. I have it set up to where when you click on a link or an image, the iframes open and close via .toggle();
  Here is my code: </p>
  
  <pre><code>&lt;div class="OpenPositions-left"&gt;
      &lt;div class="position-city"&gt;
          &lt;h2&gt;&lt;a href="&lt;?php the_field('view_positions_link_left'); ?&gt;"    class="ny-positions"&gt;&lt;?php the_field('position_city_left'); ?&gt;&lt;/a&gt;&lt;/h2&gt;
  &lt;/div&gt;
  &lt;a href="&lt;?php the_field('view_positions_link_left'); ?&gt;" class="ny-positions"&gt;
      &lt;img src="&lt;?php the_field('open_positions_left'); ?&gt;" /&gt;
  &lt;/a&gt;
  &lt;a href="&lt;?php the_field('view_positions_link_left'); ?&gt;" class="ny-positions"&gt;&lt;?php the_field('view_positions_left'); ?&gt;&lt;/a&gt;
  &lt;/div&gt;&lt;!-- end of open positions left --&gt;
  &lt;div class="OpenPositions-right"&gt;
  &lt;div class="position-cityRight"&gt;
      &lt;h2&gt;&lt;a href="&lt;?php the_field('view_positions_link_right'); ?&gt;"     class="rus-positions"&gt;&lt;?php the_field('position_city_right'); ?&gt;&lt;/a&gt;&lt;/h2&gt;
      &lt;/div&gt;  
       &lt;a href="&lt;?php the_field('view_positions_link_right'); ?&gt;" class="rus-positions"&gt;
      &lt;img src="&lt;?php the_field('open_positions_right'); ?&gt;" /&gt;
      &lt;/a&gt;
      &lt;a href="&lt;?php the_field('view_positions_link_right'); ?&gt;" class="rus-positions"&gt;&lt;?php the_field('view_positions_right'); ?&gt;&lt;/a&gt;    
      &lt;script type="text/javascript" src=""&gt;&lt;/script&gt;
      &lt;div id="iframeHeightDiv" name="" align="center" class="newyork-iframe openjobs-container"&gt;
       &lt;iframe id="inlineframe" name=""src="" frameborder="0" allowtransparency="true" sandbox="allow-forms allow-scripts allow-same-origin"&gt;   &lt;/iframe&gt;
      &lt;/div&gt;&lt;!-- end of iframe --&gt;
      &lt;div id="hr" class="rushr openjobs-container"&gt;
      &lt;script src="second-ifrmae.php"&gt;&lt;/script&gt;
  &lt;/div&gt;&lt;!-- end of bamboohr --&gt;
  &lt;/div&gt;&lt;!-- end of OpenPositions --&gt;
  
  &lt;script&gt;
  jQuery(document).ready(function($) {
      $('div.openjobs-container').each(function() {
          var $OpenJobs = $(this);    
          $('openjobs-container', $OpenJobs).click(function(e) {
              e.preventDefault();
              $div = $(div.'openjobs-container').not($div).hide();
              return false;
          });
  
      });
  
  });
  
  
  
  &lt;/script&gt;
  </code></pre>
  
  <p>Code not working any suggestions?</p>