Adapting JQuery loops in wordpress?


I am trying to convert a HTML theme into WordPress and may be this is a noob question and with my keywords it is impossible to find an answer. In original template’s custom.js, it has a loop:

$  (".navigation-link-1").on("mouseover", function () {     $  (".project-preview").css({         "background-image": "url(img/portfolio/img-1.jpg)"     }); });  $  (".navigation-link-2").on("mouseover", function () {     $  (".project-preview").css({         "background-image": "url(img/portfolio/img-2.jpg)"     }); });  $  (".navigation-link-3").on("mouseover", function () {     $  (".project-preview").css({         "background-image": "url(img/portfolio/img-3.jpg)"     }); }); 

How do I convert this loop for my custom post types ? I am thinking of options inside functions.php or template but i cannot figure with my basic wordpress knowledge. Can you help me ?

Thanks