title: I'm trying to get a table to change the text of the rows with a function
body: <p>So basically, I want to have a little setup where I can put the name of a vegetable in the input and have all of the info I need autofill into the adjacent rows, so far I've got this.. which may be a total mess I'm not sure. In the <code>insertText</code> function I had some sample text instead of the <code>whichVeggie</code> function which worked on the first row at least. No one has to lay out any code for me to copy paste or anything, but should the <code>insertText</code> and <code>whichVeggie</code> be one function? I'm just lost any help would be appreciated.</p>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>function addField(n) {
    var tr = n.parentNode.parentNode.cloneNode(true);
    document.getElementById("tbl").appendChild(tr);
  }
  
  function insertText(e) {
    if (e.keyCode == 13) {
      document.getElementById("sowTime").innerHTML = whichVeggie();
      document.getElementById("harvestTime").innerHTML = whichVeggie();
    }
  }
  
  function whichVeggie() {
    var textEntered = document.getElementById("plantNameEntered").innerHTML;
    var sowTime = getElementById("sowTime").innerHTML;
    var harvestTime = getElementById("harvestTime").innerHTML;
  
    if (textEntered == "tomato") {
      sowTime = "100 days";
      harvestTime = "200 days";
    }
    return sowTime &amp;&amp; harvestTime;
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;!DOCTYPE html&gt;
  
  &lt;title&gt;Plant Planning Guide&lt;/title&gt;
  &lt;head&gt;
    &lt;link rel="stylesheet" href="index.css" /&gt;
    &lt;link rel="preconnect" href="https://fonts.gstatic.com" /&gt;
    &lt;link
      href="https://fonts.googleapis.com/css2?family=Cormorant+Unicase:wght@300&amp;display=swap"
      rel="stylesheet"
    /&gt;
    &lt;h2&gt;When to sow, plant outdoors and harvest in zone 7a&lt;/h2&gt;
  &lt;/head&gt;
  &lt;body&gt;
    &lt;table id="tbl" style="width: 100%"&gt;
      &lt;tr&gt;
        &lt;th&gt;Plant Name&lt;/th&gt;
        &lt;th&gt;Time to Sow indoors&lt;/th&gt;
        &lt;th&gt;Time Until Harvest&lt;/th&gt;
      &lt;/tr&gt;
      &lt;tr&gt;
        &lt;td&gt;
          &lt;input
            id="plantNameEntered"
            type="text"
            name="plantName"
            placeholder="Enter Name..."
            onkeypress="insertText(event);"
          /&gt;
        &lt;/td&gt;
        &lt;td type="text" id="sowTime"&gt;&lt;/td&gt;
        &lt;td type="text" id="harvestTime"&gt;&lt;/td&gt;
        &lt;td&gt;
          &lt;input
            type="submit"
            class="button"
            value="Add another plant"
            onclick="addField(this);"
          /&gt;
        &lt;/td&gt;
      &lt;/tr&gt;
    &lt;/table&gt;
  
    &lt;script src="script.js"&gt;&lt;/script&gt;
  &lt;/body&gt;</code></pre>
  </div>
  </div>
  </p>