title: Detect element that has the same attribute value as another element
body: <p>I have some content that is loaded from a XML file with XMLHttpRequest:</p>
  
  <pre><code>&lt;div uid="29710" &gt;
  content....
  &lt;/div&gt;
  &lt;div uid="19291" &gt;
  content....
  &lt;/div&gt;
  &lt;div uid="099181" &gt;
  content....
  &lt;/div&gt;
  </code></pre>
  
  <p>The code used to get the content:</p>
  
  <pre><code>xmlhttp = new XMLHttpRequest();
  xmlhttp.open("GET","notes.xml",false);
  xmlhttp.send();
  xmlDoc = xmlhttp.responseXML; 
  
  var x = xmlDoc.getElementsByTagName("noteboard");
  var newHTML = "";
  for (i=0;i&lt;x.length;i++) { 
     newHTML += "&lt;div&gt;&lt;div uid='"+ x[i].getAttribute('uid')+"'&gt;"
              + x[i].getElementsByTagName("title")[0].childNodes[0].nodeValue
              + "&lt;br&gt;"+ x[i].getElementsByTagName("message")[0].childNodes[0].nodeValue
             +"&lt;/div&gt;&lt;/div&gt;";
  }
  document.querySelector('#panel').innerHTML += newHTML;
  </code></pre>
  
  <p>The content is updated every 3 seconds, but the problem starts when the old content is repeated and piled up, as well as the new content. Also, the UID attribute value is loaded from the same XML file as the content - so all the new repeated content has the same UID as the old repeated content. </p>
  
  <p>If I am not clear enough, this is the sort of thing that is happening:</p>
  
  <pre><code>&lt;div uid="19291"&gt;Old Content&lt;/div&gt;
  &lt;div uid="77191"&gt;New Content&lt;/div&gt;
  &lt;div uid="19291"&gt;Old Content&lt;/div&gt;
  &lt;div uid="19291"&gt;Old Content&lt;/div&gt;
  &lt;div uid="21503"&gt;New Content&lt;/div&gt;
  </code></pre>
  
  <p>So how would you remove all the divs that have the same UID value as each other, <em>except</em> for the original one ?</p>