将 javascript 代码重写为 jQuery

const navigateToFormStep = (stepNumber) => {
  document.querySelectorAll(".form-step").forEach((formStepElement) => {
      formStepElement.classList.add("d-none");
  });
  document.querySelectorAll(".form-stepper-list").forEach((formStepHeader) => {
      formStepHeader.classList.add("form-stepper-unfinished");
      formStepHeader.classList.remove("form-stepper-active", "form-stepper-completed");
  });
  document.querySelector("#step-" + stepNumber).classList.remove("d-none");
};

document.querySelectorAll(".btn-navigate-form-step").forEach((formNavigationBtn) => {
  formNavigationBtn.addEventListener("click", () => {
      const stepNumber = parseInt(formNavigationBtn.getAttribute("step_number"));
      navigateToFormStep(stepNumber);
  });
});

我尝试自己重写它，我认为我犯了很多错误。虽然控制台不发誓。

 function navigateToFormStep($stepNumber) {
$('.form-step').each(($formStepElement), function(){
  $formStepElement.addClass('d-none')
})

$('.form-stepper-list').each(($formStepHeader), function(){
  $formStepHeader.addClass('form-stepper-unfinished')
  $formStepHeader.removeClass('form-stepper-unfinished')
  $formStepHeader.removeClass('form-stepper-completed')
})
$('#step-' + $stepNumber).removeClass('d-none')

}

 (function($){
$('.btn-navigate-form-step').each(($formNavigationBtn), function() {
  $formNavigationBtn.on('click', function(){
   var stepNumber = parseInt($formNavigationBtn.attr('step_number'))
    navigateToFormStep($stepNumber)
 })
})

})

而且代码现在不起作用。也许犯了一些严重的错误。我试图编辑每一行js代码并将其翻译成jquery。