onhover how to create a boreder bottom

Question

$('.list-style-header-nav >li > a').hover(function () {

$(this).css("background-color", "red");

}, function () {

$(this).css("background-color", "white");

});

 

here on hover i want to create a border bottom and want to specify a color.how can i do it?

i tried 

border-bottom-color:"solid 2px red"; 

this things not working.