title: Hide elements in iframe
body: <p>I have an iframe (same domain) and I'm hiding some elements I don't want to display from this iframe. Everything works, but when I click on a ul > li list and I select an item of this list, the hidden elements display back again.</p>
  
  <p>The iframe don't change the ID of the hidden ítems or anything like that so I don't know why the hidden ítems display again.</p>
  
  <p>The solution I have right now is a setInterval that keep the ítems hidden but It colapses the page after some minutes inactive in the page so I need another solution.</p>
  
  <p>I tried something like detect a click function inside the iframe, but when I select a item of the list this function don't work more.</p>
  
  <pre><code>    $(function(){
          var f=$('#iframe')
          f.load(function(){ 
              f.contents().find("#____bl_k_dd").on('click', function(event) { 
                  runAfterTimeout();
              });
          });
      });
      function runAfterTimeout() {
          setTimeout(function(){
              alert("hi its me");
              $('#iframe').contents().find('body').css("background", "green");
          },2000);
      };
  </code></pre>
  
  <p>I try to detect a click function on the  element, it Works the first time, then it don't Works.</p>
  
  <p>If I change the ID of the  element to body it Works just sometimes so it's not a solution.</p>