Page reloads on hide/show button click using jQuery

Question

I\'m using jQuery to show/hide a div by clicking on the show/hide buttons. However, my code doesn\'t work because every time it returns to the way it was before

Answer 1

A couple of things here:

1) It would be best to separate the HTML from the jQuery. 2) The default behavior for a button is to submit a form, which means it will refresh the page if there is no form action. This can be fixed with preventDefault()

To sum this up in code:

HTML

Hide section below  

JS:

$(document).ready(function() {
$("#hidemultmachines").on("click", function(e) {
  e.preventDefault();
  $('#multmachines').hide();    
  $(this).hide();
  $('#showmultmachines').show();
});
});