Skip welcome & menu and move to editor
Welcome to JS Bin
Load cached copy from
 
<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<title>JS Bin</title>
</head>
<body>
  <span id="mainlink" onclick="test(event)">click me</span>
  <br />
  <a href="#">yes this link</a>
  <br />
  <a href="#">yes this link</a>
  <br />
  <a href="#">yes this link</a>
  <br />
  <a href="#">yes this link</a>
  <br />
  <a href="#">yes this link</a>
  <br />
  <a href="#">yes this link</a>
  <br />
  <a href="#">yes this link</a>
  <br />
</body>
</html>
 
function test() {
  if (!document.getElementById('myid')) {
  var mainlink = document.getElementById('mainlink');
  var newElem = document.createElement('span');
  mainlink.appendChild(newElem);
  var linkElemAttrib = document.createAttribute('id');
  linkElemAttrib.value = "myid";
  newElem.setAttributeNode(linkElemAttrib);
  
  var linkElem = document.createElement('a');
  newElem.appendChild(linkElem);
  
  var linkElemAttrib = document.createAttribute('href');
  linkElemAttrib.value = "jsbin.com";
  linkElem.setAttributeNode(linkElemAttrib);
  
  var linkElemText = document.createTextNode('new click me');
  linkElem.appendChild(linkElemText);
  
  if (document.addEventListener) {
  document.addEventListener('click', check, false);                       
  };
};
};
 
function check(e) {
  if (document.getElementById('myid')) {
    if (document.getElementById('myid').parentNode === document.getElementById('mainlink')) {
      var target = (e && e.target) || (event && event.srcElement); 
      var obj = document.getElementById('mainlink'); 
      if (target!= obj) {
        obj.removeChild(obj.lastChild);
      };
    };
  };
};
Output

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
anonymouspro
0viewers