title: JavaScript add column to table
body: <p>I want to add a single column to my html table. My code is:</p>
  
  <pre><code>$('#addColumn').click(function(){
                  $('#contentTable').css('width', $('#contentTable').width()+150)
                  $("#contentTable tr:first").append("&lt;td style="+"width:150px"+"&gt;Col&lt;/td&gt;");
                  $("#contentTable tr:gt(0)").append("&lt;td style="+"width:150px"+"&gt;&lt;/td&gt;");
              });
  </code></pre>
  
  <p>This script adds new column as last column in table. How is it possible to add new column as <code>(n-1)</code> columns? I mean that if there are <code>ABC</code>columns script should add new column <code>D</code> for <code>ABDC</code>.</p>
  
  <p>@UPDATE
  before</p>
  
  <p><a href="https://i.stack.imgur.com/ooBkD.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/ooBkD.jpg" alt="enter image description here"></a></p>
  
  <p>new function:</p>
  
  <pre><code>$('#addColumn').click(function(){
                  $('#contentTable').css('width', $('#contentTable').width()+150)
                  $('#contentTable tr:last').before('&lt;td style="+"width:150px"+"&gt;NEW_COLUMN&lt;/td&gt;')
              });
  </code></pre>
  
  <p>result:</p>
  
  <p><a href="https://i.stack.imgur.com/A2RvB.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/A2RvB.jpg" alt="enter image description here"></a></p>