Question about Ajax callback functions

Question about Ajax callback functions

I currently have several functions in my document.ready handler which are working fine. Two are designed to apply css styling to select elements:

  1. $('select.third').filter(function(){return $(this).val() == '1'; }).css({backgroundColor: 'yellow'});
  2. $('select.fourth').filter(function(){return $(this).val() == '0'; }).css({backgroundColor: 'red'});

and another makes an Ajax call to change the sort order of the elements when the user changes a select element:

  1. $('select#searchtype').change(function(event){
  2. var searchtype = $(this).val(),
  3. token = $('#token').val();
  4. $('div#allSheepDisplay').contents().remove().end().load(
  5. 'db-interaction/animals.php',
  6. {
  7. action: 'sort',
  8. searchtype: searchtype,
  9. token: token
  10. }
  11. );
  12.         // the following are not working after the Ajax call completes      
  13. $('select.third').filter(function(){return $(this).val() == '1'; }).css({backgroundColor: 'yellow'});
  14. $('select.fourth').filter(function(){return $(this).val() == '0'; }).css({backgroundColor: 'red'});
  15. });

I want the css styling rules to be updated after the Ajax call completes, but inserting the function calls at lines 13/14 ain't working. Do I need to use an .ajax() call instead of the .load() call, and have the callback function call these two functions? Or is there another solution?