Making my ajax updated div fade in

Question

I have this code that performs an ajax call and loads the results into two duplicate divs every time a dropdown is changed. I want the results to be faded into the div, to give a more obvious indication that something has changed, as its so seamless its sometimes hard to notice the change!

print("$('.ajaxdropdown').change(function(){           $.ajax({             type: "GET",             url: "/includes/html/gsm-tariff.php",             data: "c_name="+escape($(this).val()),             success: function(html){                 $("#charges-gsm").html(html);                                     //i want to fade result into these 2 divs...                 $("#charges-gsm-faq").html(html);                 $("#charges-gsm-prices").html(html);             }         });     });"); 

I've tried appending the fadein method and a few other things, but no joy.

Answer 1

You'll have to hide() it before you can use fadeIn().

UPDATE: Here's how you'd do this by chaining:

$("#charges-gsm-faq").hide().html(html).fadeIn(); $("#charges-gsm-prices").hide().html(html).fadeIn();