title: Update the data instead of adding it to my table in javascript and jquery?
body: <p>I'm working with the pusher api and I need to update the data instead of adding it to my table. The data is displayed in an html table I have in my index, The data is coming in but its making a new row every time a new state is called, I want to just update the data instead of adding a new row, only add a new row if the state has not been called.</p>
  
  <p>How do update instead of add each state's data?</p>
  
  <p>index.html </p>
  
  <pre><code>&lt;div class='test'&gt;  
  &lt;/div&gt;
  
  &lt;table class="table tg"&gt;
  &lt;tr&gt;
  &lt;th class="tg-ufsm"&gt;Location&lt;/th&gt;
  &lt;th class="On the line tg-ufsm"&gt;Calls on the Line&lt;/th&gt;
  &lt;th class="tg-ufsm"&gt;Total Calls&lt;/th&gt;
  &lt;th class="tg-ufsm"&gt;Average Duration&lt;/th&gt;
  &lt;th class="tg-ufsm"&gt;% Of All Calls Across All States&lt;/th&gt;
  &lt;/tr&gt;
  
  &lt;/table&gt;
  </code></pre>
  
  <p>And here is the javascript </p>
  
  <pre><code> channel.bind('call', function(data) {
    var location = data.location;
    var call_id = data.call_id;
    var status = data.status;   
  
    if(!tableStates[location]) {
      tableStates.location = statesEmpty();
      $('.table').append('&lt;tr&gt;&lt;td&gt;' + location + '&lt;td&gt;' + status + '&lt;/td&gt;&lt;td class="count"&gt; &lt;/tr&gt;');
      $('.test').append( $('&lt;div class="myTable ' + location + '"&gt;  &lt;div class="count"&gt;&lt;/div&gt; &lt;/div&gt;') );
    }
  
   tableStates.location.count += 1;
   $('.table').find('.count').text(tableStates.location.count);
  
  
  });
  </code></pre>