Masquer le dernier élément ne fonctionne pas - jQuery

J'ai trébuché sur jQuery et voici ce qui suit:

<form class="form" method="POST" action="<?php the_permalink(); ?>">
<?php $counter = 1; if(get_field("step_by_step_training")): ?>
<?php while(the_repeater_field("step_by_step_training")): ?>
<div class="form-row">
<p class="training"><?php echo the_sub_field("introduction"); ?></p>
<button class="next">Next</button>
</div>
<?php $counter++; endwhile; ?>
<?php endif; ?>
</form>

<script type="text/javascript">
jQuery(function($) {
$(document).ready(function() {

// prepend a "previous" button to all form-rows except the first
$("<button>").addClass("previous").text("Previous").prependTo($(".form-row").not(":first"));

// hide all form-rows, but not the first one
$(".form-row").not(":first").hide();

// add the submit button to the last form-row
$("<input>").prop("type", "submit").val("Submit").appendTo($(".form-row:last"));


// handle the previous button, we need to use "on" here as the
// previous buttons don"t exist in the dom at page load
$(".form-row").on("click", "button.previous", function(e) {
e.preventDefault();
$(this).parent("div.form-row").hide().prev("div.form-row").show();
});

$("button.next").click(function(e) {
// prevent the next buttons from submitting the form
e.preventDefault();
// hide this form-row, and show the next one
$(this).parent("div.form-row").hide().next("div.form-row").show();
});

});
});
</script>

Cela crée un processus étape par étape.

Je veux cacher le bouton suivant à la dernière étape, mais je ne peux pas sembler le faire fonctionner. J’ai essayé ce qui suit, mais les boutons suivants cessent de fonctionner.

$("button.next").is(":last").hide();

Réponses:

Vous pouvez essayer ceci:

  $("button.next").last().hide();

Basé sur la documentation jQuery, est() renvoie vrai quand au moins un des éléments correspond à l'argument.

Donc, ce que vous voulez vraiment, c'est faire $("button.next").last().hide() ou $("button.next:last").hide()