How to shorten such a jquery entry?

Question

JavaScript

There is this code:

$('#wpu1').hover(function(){$('#epu1').toggle();});
 $('#wpu2').hover(function(){$('#epu2').toggle();});
 $('#wpu3').hover(function(){$('#epu3').toggle();});
 $('#wpu4').hover(function(){$('#epu4').toggle();});
 $('#wpu5').hover(function(){$('#epu5').toggle();});

Please tell me how to shorten it, I think there is an option for anyone, so as not to create a function for each or something else. I'm just learning the language, so I turn to you for a hint.

Answer 1

for (var i = 1; i < 6; i++) {
$('#wpu'+i).hover(function(){$('#epu'+i).toggle();});
}

Answer 2

I would generally suggest doing this on css3. With the translate property. If you are interested, then write, I will help)