How to add new row to html table with jquery without triggering blade foreach

I have a html table that I render from data from my database in a blade view. It populates the rows and headings with a foreach statement like so. This is just what the tbody foreach looks like

   <table class="table">
  <tbody>

     <tbody>
      <?php $count = 1; ?>
      <?php $sortcount = 0; ?>

      @if(!empty($tables['values']))

      @foreach($tables['values'] as $values_sort => $values)

     <tr>
         @foreach($tables['values'][$values_sort] as $vs => $valuestest)
		 <td class="text-center">Some Value</td>
	@endforeach
</tr>
@endforeach
@endif
	</tbody>
</table>

This works fine when I first load the page and all the data is populated correctly. However, I have a button to add a new column to this table which triggers a jquery function to add a new column to the table like so.

$('tbody').find('tr').each(function(index, value) { 
        $(this).find('td').last().before('<td class="new">Some Data </td');
  });

This also works fine and adds a column as it should to the table but it also appears like its trying to trigger the @foreach statement after the which returns a 500 error from the server.

How do I add a new column like this and prevent it from calling the foreach() function in the html table?

Thanks