title: how to delete a div which has been created using javascript
body: <p>In my following code I have created a div using java script.when i click the button the <em>div</em> is displayed repeatedly.What should I do to display once and get cleared.</p>
  
  <pre><code> &lt;html&gt;
  &lt;head&gt;
  &lt;title&gt;Div tag using Javascript
  &lt;/title&gt;
  &lt;!--&lt;link href="divtag1.js" type="text/javascript"&gt;--&gt;
  &lt;style&gt;
  body{
      background:#00ffff;
  }
  .myclass{
      background:#30a0d3;
      color:#123456;
      position:relative;
      left:300px;
      right:300px;
      top:150px;
      height:100px;
      width:700px;
      border:2px solid #000000;
      border radius:5px;
      padding:20px;
      margin:50px;
  }
  
  &lt;/style&gt;
  
  &lt;script&gt;
  function myfunction(){
  var div = document.createElement('div');
  div.innerHTML = "my &lt;b&gt;new&lt;/b&gt; skill - &lt;large&gt;DOM maniuplation!&lt;/large&gt;";
  // set style
  div.style.color = 'red';
  // better to use CSS though - just set class
  div.setAttribute('class', 'myclass'); // and make sure myclass has some styles in css
  document.body.appendChild(div);
  var oldChild=element.removeChild(child)
  element.removeChild(child);
  }
  &lt;/script&gt;
  
  &lt;/head&gt;
  &lt;body&gt;
  &lt;div&gt;
  &lt;input type="button" value="Click Me!!" onclick="return myfunction();"&gt;&lt;/div&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>Any suggestions are highly appreciated.</p>