JSFiddle - React, Tailwind, and code Playground

HTML

<table class="table" style="margin:0;">
    <tr>
        <th width="10%" style="border-top:0;">Id</th>
        <th style="border-top:0;">Text</th>
        <th width="10%" style="border-top:0;">Data</th>
    </tr>
</table>
<div class="data">
    <table class="table table-striped">
        <tr>
            <td width="10%">12.1.124.144</td>
            <td class="slide">testing updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updatestesting updates</td>
            <td width="10%">2014-02-02 18:01:14</td>
        </tr>
        <tr>
            <td width="10%">12.1.124.144</td>
            <td class="slide">testing updates</td>
            <td width="10%">2014-02-02 18:01:13</td>
        </tr>
        <tr>
            <td width="10%">12.1.124.144</td>
            <td class="slide">testing updates</td>
            <td width="10%">2014-02-02 18:01:13</td>
        </tr>
        <tr>
            <td width="10%">12.1.124.144</td>
            <td class="slide">testing updates</td>
            <td width="10%">2014-02-02 18:01:13</td>
        </tr>
        <tr>
            <td width="10%">12.1.124.144</td>
            <td class="slide">testing updates</td>
            <td width="10%">2014-02-02 18:01:13</td>
        </tr>


    </table>
</div>

CSS

body {
    scrollbar-face-color: #DDD;
    background-size:cover;
    border-top:5px solid #000000;
    background:#ebe8de;
}
.data {
    height: 50%;
    overflow: scroll;
    overflow-x: hidden;
}
.slide {
	text-overflow: ellipsis;
	width: 200px;
	white-space: nowrap;
	overflow: hidden;
}

JavaScript

$(".slide").click(function () {
          $(this).toggleClass('slide');
      });