title: Save <td> as a variable
body: <p>Hello I currently have a script where you type in an Item name into an input. along with its size, colour, and other options. It all saves as individual items with there custom specifications like so:
  example t-shirt black, Large, Any size etc..</p>
  
  <p>I have 3 buttons on the bottom of the table one is a input where you can name the table data then you press the add button and it adds this info as a variable where it can be called using a  inside another html file. The other is a load select where you can load up the  and edit it similar to what this GitHub file has with loading its billing info 
  ( <a href="https://github.com/hunterbdm/Deadass-Splash" rel="nofollow noreferrer">https://github.com/hunterbdm/Deadass-Splash</a> )</p>
  
  <p>I also want to not only save the entire  as a variable but somehow save each line individually so I can later call it in the backend of the script where My programs nows what shirt to get along with the size and colour. </p>
  
  <p>So how would I go about writing javascript(jQuery that could save the  and each line individually so I can call it later in the backend  maybe something like (variableName).line<a href="https://i.stack.imgur.com/2fNxy.png" rel="nofollow noreferrer">1</a> = t-shirt black Large.</p>
  
  <p>here is the html for my table:</p>
  
  <pre class="lang-html prettyprint-override"><code>&lt;div id="taskContainer"&gt;
    &lt;table id="items-table"&gt;
      &lt;!--&lt;caption&gt;Task&lt;/caption&gt;--&gt;
      &lt;tr&gt;
        &lt;th&gt;Item&lt;/th&gt;
        &lt;th&gt;Size&lt;/th&gt;
        &lt;th colspan="3"&gt;Options&lt;/th&gt;
      &lt;/tr&gt;
      &lt;tr&gt;
        &lt;td&gt; &lt;/td&gt;
      &lt;/tr&gt;
    &lt;/table&gt;
  &lt;/div&gt;
  &lt;label for="loadTask"&gt;Load Task:&lt;/label&gt;
  &lt;label for="taskName"&gt;Task Name:&lt;/label&gt;
  &lt;select id="loadTask"&gt;&lt;/select&gt;
  &lt;input type="text" id="taskName"&gt;&lt;/input&gt;
  &lt;button type="submit" id="addTask"&gt;Add&lt;/button&gt;
  </code></pre>
  
  
  
  <p>How would I go about doing this? would I need to label every  so I could call [2] [2] to call each line with its special customizations? Im thinking very pythonically since Im new to Js and more experienced with python.</p>
  
  <p>Here is a photo of what my table looks like:</p>
  
  <p><a href="https://i.stack.imgur.com/2fNxy.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/2fNxy.png" alt="enter image description here"></a></p>
  
  <p>Would I use something like ipcRenderer?</p>
  
  <p>Here is also my JS how would I add some sort of counter so that I could then set the amount of lines with that number:</p>
  
  <pre><code>function addRow() {
      var item_text = $('#item-input').val();
      var item_color = $('#color-input').val();
      var size_text = $('#sizes-item').val();
      var any_color = $('#any-color').is(':checked') ? 'Any Color' : '';
      var any_size = $('#any-size').is(':checked') ? 'Any Size' : '';
      $('#items-table').append('&lt;tr&gt;'
          +'&lt;td&gt;'+item_text+' '+item_color+'&lt;/td&gt;'
          +'&lt;td&gt;'+size_text+'&lt;/td&gt;'
          +'&lt;td&gt;'+any_color+' '+any_size+'&lt;/td&gt;'
          +'&lt;td&gt;&lt;button class="remove-btn"&gt;&lt;div class="thex"&gt;X&lt;/div&gt;&lt;/button&gt;&lt;td&gt;'
          +'&lt;/tr&gt;');
  } 
  </code></pre>
  
  <p>..</p>
  
  <pre><code>$(function(){
    $('#add-item').click(function(){
      addRow();
      return false;
    });
    $('body').on('click', '.remove-btn', function(){
      $(this).parent().parent().remove();
    });
  });
  </code></pre>