JSFiddle - React, Tailwind, and code Playground

HTML

<table>
 <tbody>
   <tr>
    <td>1</td>
       <td>Text,that, needs, to, be, wrapped.<span class="count">not this</span><button>Wrap</button>
    </td>
   </tr>
   <tr>
    <td>2</td>
    <td>Text, that, needs, to, be, wrapped.<span class="count">not this</span><button>Wrap</button></td>
   </tr>
  </tbody>
</table>

CSS

.new{
background:red;
/*padding:10px/*
}

JavaScript

$('button').click(function(){    
    var text = $(this).closest('td').contents().eq(0).text().split(",");
    var keep = $(this).closest('td').find(".count");
    var button = $(this).closest('td').find('button');
       for( var i = 0, len = text.length; i < len; i++ ) {
           text[i] = '<span class="new">' + text[i] + '</span>';
       }   
    $(this).closest('td').html(text.join(' ')).append(keep).append(button);  
});