div>
<div class="sidebar-menu">
  <nav>
    <ul>
      <li><a href="index.html" class="active">Home</a></li>
      <li><a href="about.html">About me</a></li>
      <li class="dropdown">
        <a href="portfolio.html">Portfolio</a>
        <i class="fa fa-chevron-down"></i>

          <ul class="dropdown-menu">
            <li><a href="#"><i class="fa fa-chevron-right"></i>Fashion</a></li>
            <li><a href="#"><i class="fa fa-chevron-right"></i>Beauty</a></li>
            <li><a href="#"><i class="fa fa-chevron-right"></i>Wedding</a></li>
            <li><a href="#"><i class="fa fa-chevron-right"></i>Tests</a></li>
            <li><a href="#"><i class="fa fa-chevron-right"></i>Travel</a></li>
            <li><a href="#"><i class="fa fa-chevron-right"></i>Single Project</a></li>
          </ul>
      </li>
      <li><a href="services.html">Services</a></li>
      <li><a href="contacts.html">Contact me</a></li>
    </ul>
  </nav>

$(function(){

  var chevron = $('.fa-chevron-down');
  var dropDown = $('.dropdown-menu');
  var drop = $('.dropdown > a');

  drop.on('mouseover', function(){
    $(this).css({
      'background' : '#E50A0A',
      'color' : '#fff'
    });
    chevron.css({
      'color' : '#fff'
    });
  });
  drop.on('mouseout', function(){
    $(this).css({
      'background' : '#fff',
      'color' : '#191919'
    });
    chevron.css({
      'color' : '#ccc'
    });
  });

  chevron.on('mouseover', function(){
    $(this).css({
      'color' : '#fff'
    });
    $(this).prev('a').css({
      'background' : '#E50A0A',
      'color' : '#fff'
    });
  });
  chevron.on('mouseout', function(){
    $(this).css({
      'color' : '#ccc'
    });
    $(this).prev('a').css({
      'background' : '#fff',
      'color' : '#191919'
    });
  });