Я создал плагин
js/AnimateForm/animated-form.js
(function( $ ){
$.fn.animatedForm = function () {
return this.html(`<div class="sa">
<div class="sa-success">
<div class="sa-success-tip"></div>
<div class="sa-success-long"></div>
<div class="sa-success-placeholder"></div>
<div class="sa-success-fix"></div>
</div>
</div>`)
}
})( JQuery );
И стили в плагине js/AnimateForm/css/animated-form.css, но принципе не важно что там написано
В index.html я прописал
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
...
<link rel="stylesheet" href="js/AnimateForm/css/animate-form.css">
</head>
<body>
<div class="focus_form-message"></div>
<button type="submit" class="focus_form-button">Записаться</button>
<script src="https://code.jquery.com/jquery-3.3.1.min.js" integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8=" crossorigin="anonymous"></script>
<script src="resource/js/form.js"></script>
<script src="js/AnimateForm/animate-form.js"></script>
</body>
</html>
В файле resource/js/form.js
$(document).ready(function(){
$('#focus_form_recording').submit(function (e) {
e.preventDefault();
$.post({
...
})
.done(request => {
...
setTimeout(function () {
$('.focus_form-message').animatedForm();
// $('.focus_form-button').html(`Записаться`);
}, 500);
}
console.log(res);
})
.fail(err => console.error(err))
})
});
Но получаю ответ
Uncaught TypeError: $(...).animatedForm is not a function
Ссылка на гитхаб
https://github.com/rusline18/latina 