Jquery enable/disable button not working inside form

Jquery enable/disable button not working inside form

Hi guys,

I'm new to jquery and currently having a problem  with it. I have created a html form with a table in it. In this table there are 2 rows with 1 td each. In both tds I have a button. btn 2 is disabled and when I click btn 1, btn 2 has to become enabled.

I have written this code for it:
[code]
<script>

                $(function() {
               
                    $('#btn2').attr("disabled", true);

                    $('#btn1').on('click', function() {
                       
                        $('#btn2').prop("disabled", false);
                       
                    });
                   
   
                });
               


            </script>
[/code]
When the page loads btn 2 is disabled ==> OK
When I click btn 1, btn 2 is enabled but only for like a millisecond, then it is disabled again. Any ideas why this is ?