Question

How to remove and add class in a jquery ajax success function?

index.html

$.ajax({
   url: "text.php", 
   dataType: "html",
   type: 'POST', 
   data: "data=test", 
   success: function(data){
       $("#result").html(data);
      $('#show').find('.show').removeClass('show').addClass('hidden');
          $('#show').find('.hidden').html('hidden');    
   }
});

<div id="result"></div>

text.php, something as this:

<a href="#" id="show"><p class="show">show</p></a>

and I need return back html in div#result as

<a href="#" id="show"><p class="hidden">hidden</p></a>

Answer 1

I would recommend not removing/adding classes for show/hide, just use jQuery’s $.show() and $.hide()

So:

var $result = $("#result");

$.ajax({
   url: "text.php", 
   dataType: "html",
   type: 'POST', 
   data: "data=test", 
   success: function(data){
      $result.html(data);
      $('#show p').hide();
      $('#show p').text('hidden');    
   }
});

If I understand what you are asking correctly.