title: How to clone a <tr> in a table with Javascript
body: <p>I want to duplicate the second <code>&lt;tr&gt;</code> everytime I click button add, as it shows in here, I mean I want to whenever I click on the button add a new <code>&lt;tr&gt;</code> will be added that do the same thing as the previous one.</p>
  
  <pre><code>&lt;form id="frm1" action="Calculate.html"&gt;
  &lt;table id= "myTable"&gt;
      &lt;tr&gt;
          &lt;th&gt;A&lt;/th&gt;
          &lt;th&gt;B&lt;/th&gt;
          &lt;th&gt;C&lt;/th&gt;
          &lt;th&gt;D&lt;/th&gt;
          &lt;th&gt;E&lt;/th&gt;
      &lt;/tr&gt;
      &lt;tr id= "rowToClone"&gt;
          &lt;td&gt;
              &lt;select id= "products"&gt;
                  &lt;option value="80"&gt;Product-A&lt;/option&gt;
                  &lt;option value="80"&gt;Product-B&lt;/option&gt;
                  &lt;option value="80"&gt;Product-C&lt;/option&gt;
                  &lt;option value="80"&gt;Product-D&lt;/option&gt;
                  &lt;option value="16"&gt;Product-E&lt;/option&gt;       
              &lt;/select&gt;
          &lt;/td&gt;
          &lt;td&gt;&lt;input type="number" id="ndc" placeholder=""&gt;&lt;/td&gt;
          &lt;td&gt;&lt;p id="ndpc"&gt;&lt;/p&gt;&lt;/td&gt;
          &lt;td&gt;&lt;p id="pu"&gt;&lt;/p&gt;&lt;/td&gt;
          &lt;td&gt;&lt;p id="ptpp"&gt;&lt;/p&gt;&lt;/td&gt;
      &lt;/tr&gt;
  &lt;/table&gt;
  &lt;input type="button" onclick="Calculate()" value="calculate"&gt;
  &lt;input type="button" onclick="AddSelect()" value="Add"&gt;
  </code></pre>
  
  <p>I want it to do the same whole thing, I tried but never got successful the second part I am stuck to</p>
  
  <pre><code>first part:
          function Calculate() {
                var e = document.getElementById("products");
                var productValue = e.options[e.selectedIndex].value;
                document.getElementById("ndpc").innerHTML = productValue;
                document.getElementById("ndpc").value = productValue;
                if (e.selectedIndex === 0){
                  document.getElementById("pu").value = 21.2; 
                }
                else if (e.selectedIndex === 1) {
                    document.getElementById("pu").value = 25.7;   
                  }
                  else if (e.selectedIndex === 2 || e.selectedIndex === 3 ) {
                    document.getElementById("pu").value = 14; 
                  }               
                  else {
                    document.getElementById("pu").value = 6;
                  }
                var pu = document.getElementById("pu").value;
                document.getElementById("pu").innerHTML = pu;
                var ndc = document.getElementById("ndc").value;
                var ndpc = document.getElementById("ndpc").value;
                var Result = ndc * ndpc * pu;
                document.getElementById("ptpp").innerHTML = Result;
   };
  </code></pre>
  
  <p>the second part that I want to solve: </p>
  
  <pre><code>        function AddSelect(){
              var row = document.getElementbyId("rowToClone");  
              var table = document.getElementById("myTable");   
              var clone = row.cloneNode(true);                    
              clone.id = "New";                              
              function createRow() {
              //I don't know what to do.
   } };
  </code></pre>
  
  <p>I am new to Javascript obviously, please help me.</p>