
$(document).ready(function() {

  //add a text background
  $('.menuitem').each(function() {

    //first get the text that needs to be in the new div
    var buttonText = $(this).find('.menuitemtext').text();

    //create a background text div containing the new text
    $(this).prepend('<div class="menuitembgtext">'+buttonText+'</div>');

  });

  //adjust opacity of background text
  $('.menuitembgtext').css('opacity',0.7);

  //add background to all menu buttons
  $('.menuitem').prepend('<div class="menuitembg"></div>');

  //apply opacity to new background
  $('.menuitembg').css('opacity',0);

  //rollover animation for menu items
  $('.menuitem').hover(function() {

    //fade the background in
    $(this).children('.menuitembg').animate({ opacity: 0.9 }, 660);

  }, function() {

    //fade the background out
    $(this).children('.menuitembg').animate({ opacity: 0 }, 660);

  });

});
