Skip welcome & menu and move to editor
Welcome to JS Bin
File
Add library
Share
Login or Register
Blog
Help
Load cached copy from
  • Run with JS
  • Save
  • Share
  • …
 
<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
  <meta charset="utf-8">
  <title>JS Bin</title>
</head>
<body>
  <input id="usrinput" />
  <div id="updateDiv" />
<script>
  function writePara()
 {
    var comment = document.getElementById("usrinput").value;
    var newParagraph = document.createElement('p');
    newParagraph.textContent = comment;
    document.getElementById("updateDiv").appendChild(newParagraph);
​
    var button = document.createElement("button");
    var Btext=document.createTextNode("EDIT");
    button.appendChild(Btext);
    document.getElementById("updateDiv").appendChild(button);
​
    button.onclick = 
    (
        function() 
        {
    var edit = prompt("Type to edit", "");
    newParagraph.innerHTML = edit;
        }
    );
    var button2 = document.createElement("button");
    var Btext2=document.createTextNode("DELETE");
    button2.appendChild(Btext2);
    document.getElementById("updateDiv").appendChild(button2);
    button2.onclick = 
    (
        function ()
        {
​
    newParagraph.parentNode.removeChild(newParagraph);
    button.parentNode.removeChild(button);
    button2.parentNode.removeChild(button2);
        }
​
​
    );
  }
  
  $("#usrinput").on("change", writePara);
  </script>
</body>
</html>
Output

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

Dismiss x
public
Bin info
simeonpro
0viewers