How to trim long words inside a table?

Question

Bootstrap

Good evening!
Using bootstrap 3.3.7
Made a simple table

<table class="table">
<thead>
<tr>
    <th width="30%"></th>
    <th width="40%"></th>
    <th width="30%"></th>
</tr>
<thead>
<tbody>
<tr>
<td>ssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssss</td>
<td>dddddddddddddddddddddddddddddddddddddddddddddddddddd</td>
<td>jjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjj</td>
</tr>
</tbody>
</table>

If the words are very long, then the table expands. How to make if the words are longer than the width of the column, then they are cut off?
In simple md I use the class:

.clip {
    white-space: normal; /* Запрещаем перенос строк */
    overflow: hidden; /* Обрезаем все, что не помещается в область */
    text-overflow: ellipsis; /* Добавляем многоточие */
 }

But they don't work inside td

Answer 1

https://jsfiddle.net/85v8sohe/5/