title: replace the element instead of append
body: <p>I have the following code where i need to replace the newly created TD column with the new option from the dropdown select. Here is my code </p>
  
  <pre><code>$("#myselction").change(function(e) {
      var neData = $("#myselction").val();
      $("table.data thead tr").append("&lt;th&gt;Idea&lt;/th&gt;");
      $("table.data tr:gt(0)").append("&lt;td&gt;" + neData + "&lt;/td&gt;");
  });
  </code></pre>
  
  <p>It is appending the data correctly at the end of the table, but everytime i select new option from dropdown, it adds another td column, instead i want to replace it with the one already created and if its new one create it first time.</p>
  
  <p>Alo i am using the following function to add/remove class for odd and even </p>
  
  <pre><code>    zebRaRows('.data tbody tr:odd td', 'odd');
  function zebRaRows(selector, className){
    $(selector).removeClass(className).addClass(className);
  }
  </code></pre>
  
  <p>How do i add the above to the dynamically created column</p>