How to remove button with one click using jQuery

Question

I have the following button on the page:

    <div class="col-xs-12 col-sm-2" >
        <div class="">
            <a class="btn btn-info btn-sm btn-raised marginRight10"  id="adicionar" onclick="AddHistorico()"><i class="material-icons">add</i> <span class="marginLeft5">@QJW.Resources.Palavra.ADICIONAR</span></a>
        </div>
    </div>

I need to remove it after the onclick:

<td class="text-center"> 
   <a class="btn btn-mini btn-raised btn-info margin0" onclick="AlterarHistorico()"> 
       <i class="material-icons">create</i>
   </a>
</td>

Inside this button (shown above) has a function AlterarHistorico() I want to put the remove function inside her

I tried that way but I have no knowledge with jQuery

    $(".remover").click(function () {
      var adicionar = $(this).attr("adicionar");
     $("#remover" + adicionar).remove();
    });

Answer 1

Follow an example below, there is the button called example when clicked on it, the same goes.

jQuery(document).ready(function($) {
  $('#btn_teste').click(function() {
    this.remove();
  });
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<button id="btn_teste">exemplo</button>

Answer 2

I used the following jquery function:

//function that added Hidden in the field I wanted it to disappear $("#add"). addClass("Hidden")

add is the shortcut to locate the field and add the Hidden in it