How do I put a fade effect on a jquery background effect?

Question

Hi I would like to use a fade in effect on this jquery and have it appear on touch devices on click.

  $('#one').hover(function() {
    $('#one_text').css('background-color', '#fdb913');
  }, function() {
    // on mouseout, reset the background colour
    $('#one_text').css('background-color', '');
  });

Answer 1

You can try this

$('#one').hover(function() {
    $('#one_text').css('background-color', '#fdb913').fadeOut( 100 );
  }, function() {
    // on mouseout, reset the background colour
    $('#one_text').css('background-color', '').fadeIn( 500 );
  });

See Plunker https://plnkr.co/edit/tfYEihJ8Z2SfXP1ShAKL?p=preview