Make div(Inside gridview) visible using javascript

Question

I am having a gridview which contain div as item template which is currently invisible but I want to make it visible on link click

my div code is

    <asp:TemplateField HeaderStyle-Width="100px">
<ItemTemplate>
    <img alt="fdhfgh" src="~/Images/Resources/thumb/edit.png" onclick="<%# DataBinder.Eval(Container,"RowIndex","javascript:DisplayAction('Div{0}')") %>" />
    <div id='<%# DataBinder.Eval(Container,"RowIndex","Div{0}") %>' class="displayAction">
        <asp:HyperLink ID="hlnkEdit" runat="server" Text="Edit" CssClass="logo" NavigateUrl='<%# "~/Recruiter/AddUser.aspx?UserId=" + Eval("ID") + "&ProfileId=" + Eval("REF_PROFILE_ID") + "&UserTypeId=" + Eval("USER_TYPE_ID")+"&AccessType=EditAllUser" %>'
            ImageUrl="~/Images/Resources/thumb/edit.png" ToolTip='<%# "Edit - " + Eval("Name") %>'>
        </asp:HyperLink>
    </div>
</ItemTemplate>

and my javascript code is

function DisplayAction(div) {
try {

 document.getElementById(div).style.display = "none";
 } catch (e) {
  alert(e);
 }

}

and my css is

.displayAction
{
display:none;
z-index:1000;
width:100px;
}

but I am not able to show div through javascript Please guide me

Answer 1

Your javascript was setting the control to invisible again. Try this instead:

function DisplayAction(div) {
  try {
     document.getElementById(div).style.display = "";
  } catch (e) {
     alert(e);
  }
}

Answer 2

did you check if the element you're selecting is correct?

Try with console.log and hover it in your debugger. Aristos' suggestion should be working.