jQuery hover 2 элемента

$(document).ready(function(){ 
  $('body').append('<div class="div_1"></div><div class="div_2"></div>'); 
  var first_hover = true; 
  $(document).on('mouseover', '.div_1', function(){ 
    if(first_hover){ 
      $('.div_2').show(); 
      first_hover = false; 
    } 
  }); 
  $(document).on('mouseover', '.div_2', function(){ 
    $('.div_2').show(); 
  }); 
  $(document).on('mouseleave', '.div_1', function(){ 
    if(!$('.div_2').is(":hover")){ 
      $('.div_2').hide(); 
      setTimeout(function(){$('.div_1').hide();}, 1000); 
    }     
  }); 
   
  $(document).on('mouseleave', '.div_2', function(){ 
    if(!$('.div_1').is(":hover")){ 
      $('.div_2').hide(); 
      setTimeout(function(){$('.div_1').hide();}, 1000); 
    } 
    else{ 
      $('.div_2').hide(); 
    } 
  }); 
   
});

body{ 
  margin-top: 50px; 
} 
.div_1{ 
  height: 20px; 
  background: red; 
} 
.div_2{ 
  height: 20px; 
  background: blue; 
  display: none; 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>