Javascript Adding an Id Attribute to Another Created Element

Javascript Adding an Id Attribute to Another Created Element

I have some code here that will do the following. The code creates an element "p" then I append it to a "div" in the HTML. I would like that "p" I just created have an unique identifier (ID) and set the name of the ID. So later on when the user wants to delete the last created element it will be able to get the ID so it can removeChild. Here is the code:

JavaScript:

  var $ = function (id)
  {
      return document.getElementById(id);
  }

  function ShowResponse ()
  {
  var myResponse = $("myresponse").value;

  var myPara = document.createElement("p");
  var myDiv = $("mydiv");
  myDiv.appendChild(myPara);

  var myID = document.createElement("id");
  myID.setAttribute("value", ID)

  var myText = document.createTextNode(myResponse);
  myPara.appendChild(myText);
  }

  function RemoveResponse ()
  {

  }

  window.onload = function ()
  {
      $("showresponse").onclick = ShowResponse;
      $("removeresponse").onclick = RemoveResponse;
  }

HTML:

  <body>
  <div id="mydiv">
  <h1>Practice</h1>

  <p>Hi There</p>
  <p>How are you?</p>

  <p>
<input type="text" id="myresponse">
<br><input type="button" id="showresponse" value="Show Response">
<input type="button" id="removeresponse" value="Remove Response">
  </p>

  <hr>
 </div>

 </body>

3 Answers

Since id is an attribute don't create an id element, just do this:

myPara.setAttribute("id", "id_you_like");
2

You set an element's id by setting its corresponding property:

myPara.id = ID;

You can use dot notation.

myPara.id = 'anyNameYouLike'; 

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Sarah Jenkins
Author

Sarah Jenkins

Sarah Jenkins is a veteran tech journalist with over 12 years of experience covering artificial intelligence, mobile innovations, and digital ethics. Her insights have appeared in leading technology publications worldwide.