remove text inside small without raising the "a" tag with jquery

Question

I have the following code, and would like to remove only the text ' Configuration options:' without changing the "a" tag with jquery, can anyone help me?

<small>

Opções de configuração: 

<a href="javascript:void(0);" onclick="teste" class="hiperlink" alt="">Alterar
</a>

</small>

Answer 1

You can pick up text within elements with nodeType == 3:

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

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<small>

Opções de configuração: 

<a href="javascript:void(0);" onclick="teste" class="hiperlink" alt="">Alterar
</a>

</small>

Answer 2

I created a button that when clicked will store the link in a variable (selecting by its class hyperlink) then clear the contents of the tag <small> with the method Empty() and then add to its content the variable link through the method append().

$("#Remover").on("click", function(){
  var link = $(".hiperlink");
  $("small").empty().append(link);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<small>
  Opções de configuração: 
  <a href="javascript:void(0);" onclick="teste" class="hiperlink" alt="">
    Alterar
  </a>
</small>

<div>
  <button id="Remover">
    Clique para remover o texto
  </button>
</div>

Answer 3

You can change html this way

$("#tag-small").html($("#tag-small a"))

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<small id="tag-small">

Opções de configuração: 

<a href="javascript:void(0);" onclick="teste" class="hiperlink" alt="">Alterar
</a>

</small>

Answer 4

One possible solution is to change yours html for

$("small > span").text("");

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<small>
    
  <span>Opções de configuração:</span> 

  <a href="javascript:void(0);" onclick="teste" class="hiperlink" alt="">
    Alterar
  </a>

</small>