Button Causing Page To Reload

I am using html and jquery on my page. In my html i have one button which when clicked will fire one function. When page loads i call main function in document ready. Here is my co

Solution 1:

by default BUTTONS are of type SUBMIT, try this instead

<button type="button" id="btnSearch" onclick="search()" >Search</button>

Solution 2:

This is working fine for me. See demo

      $(document).ready(function () {
        main();

      });
      function main(){
      		  //some code goes here
      			alert('main');          
      }

      function search(){
           //some logic
           alert('search');
      }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div>
  <button id="btnSearch" onclick="search()" >Search</button>
</div>