title: Mootools filtering
body: <p>How can I filter (replace <code>empty()</code> function) in my div container using mootools?
  Question here: How can I replace my code below to:</p>
  
  <ol>
  <li>Remove from container(<code>&lt;div id="fc_contacts" class="fc_contacts"&gt;</code>) blocks with <code>id="fc_ID"</code> which not exist in JSON string</li>
  <li>Add new block to container(<code>&lt;div id="fc_contacts" class="fc_contacts"&gt;</code>) if if doesn't exist in container </li>
  <li>If <code>friend_id</code> is in container and in the JSON - do nothing. </li>
  </ol>
  
  <p>Check in the code please.   </p>
  
  <p>My code below:</p>
  
  <pre><code>{"users": [{"friend_id":"62","name":"admin","username":"admin"},{"friend_id":"66","name":"other","username":"other"}],"total": "1","total_online":"1"}
  
      onSuccess: function(f){ /*Periodical function*/                                 
          for(var i=0; i&lt; f.users.length;i++){
              if(f.users[i].friend_id){                                                           
                  friends.push(chat.render('add_contact',f.users[i]));
              } 
          }
  
          /*  Question here: How can I replace my code below to:
              1. Remove from container(&lt;div id="fc_contacts" class="fc_contacts"&gt;) blocks with id="fc_ID" which not exist in JSON string
              2. Add new block to container(&lt;div id="fc_contacts" class="fc_contacts"&gt;) if if doesn't exist in container 
              3. If friend_id is in container and in the JSON - do nothing.       
          */
  
          $('fc_contacts').empty(); /*Replace this*/
          $('fc_contacts').addContacts(friends.join(''), 'bottom');   /*ELSE - ADD NEW*/ //el.empty();
  
      }
  
  
      Element.implement({
          addContacts: function(html,where){
              return this.grab(new Element('&lt;div&gt;', {
                  'html': html,
                  'class': 'fc_contacts_container'
              }),where);          
          }
      });
  
  
      &lt;div id="fc_contacts" class="fc_contacts"&gt;
          &lt;div class="fc_contacts_container"&gt;
              &lt;div class="fc_contact clear_fix" id="fc_62"&gt;
                  &lt;!--OTHER HTML!-&gt;
              &lt;/div&gt;
          &lt;/div&gt;
          &lt;div class="fc_contacts_container"&gt;
              &lt;div class="fc_contact clear_fix" id="fc_66"&gt;
                  &lt;!--OTHER HTML!-&gt;
              &lt;/div&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  </code></pre>
  
  <p>Thanks!</p>
  
  <p>P.S</p>
  
  <p>It works with JQUERY (But I need it to be compatible with Mootools):</p>
  
  <pre><code>var ids = [];   
  for(var i=0; i&lt;f.users.length;i++){                             
  ids.push('fc-' + f.users[i].friend_id);
  }
  jQuery('#fc_contacts').append(friends.join('')).children().filter(function(i) {
      return ids.indexOf(this.id) === -1;
  }).remove();
  </code></pre>