jquery toggle() не работает на странице содержания

Question

Мне интересно, почему ниже код не работает. Может, кто-нибудь из вас мне поможет, пожалуйста?

<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="Server"> 
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script> 
    <script type="text/javascript"> 
     $(document).ready(function() { 
      $("#button").click(function() { 
       $("#hide").toggle(); 
      }); 
     }); 
    </script> 
    <asp:Button ID="button" runat="server" Text="button" OnClientClick="return false" /> 
    <div id="hide"> 
    <asp:Button ID="show" runat="server" Text="example" /> 
    </div> 
</asp:Content> 

EDIT: Что в случае, когда кнопка находится в GridView или вложенной gridviev? Когда я использую
$("#<%= button.ClientID %>") это возвращает мне сообщение об ошибке: «Название« кнопка »не существует в текущем контексте». Сможете ли вы мне помочь в этом случае?

Answer 1

Это отвечает в другом месте: How to stop ASP.NET from changing IDs in order to use jQuery

ASP.Net не выписывая идентификатор для кнопки, как можно было бы ожидать ,

Answer 2

Try:

$("#<%= button.ClientID %>").click(function() { 
    $("#hide").toggle(); 
}); 

Answer 3

Попробуйте это:

$("#<%= button.ClientID %>").click(function() { 
    $("#hide").toggle(); 
});