Deleting element text without deleting his children jQuery or JS

Question

I have thr following code and I'm tring to delete the text inside the father element ('ttt') without deleting the children elements. How can I achieve that? thanks.

My code:

<td>ttt
<input class="edit dialogBtn" type="button" value="Edit" onclick="initiateDialog($(this))">
<div data-id="E81K900104" hidden="hidden">ttt</div>
</td>

Answer 1

You need to filter out the textnodes and remove them.

$("td").contents().filter(function() {
        return this.nodeType == 3;
    }).remove();

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<table>
  <tbody>
    <tr>
      <td>ttt
        <input class="edit dialogBtn" type="button" value="Edit" onclick="initiateDialog($(this))">
        <div data-id="E81K900104" hidden="hidden">ttt</div>
      </td>
    </tr>
  </tbody>
</table>