Change cssclass of button inside datalist using jquery in asp.net

Question

I have a button inside datalist, if I click one button have to change the css of other button in jquery.

I have more images in my page. my code accept only one "like". I want to differentiate which one I selected.

jquery

function Addlike(btnlike, hdnId, term, cId) {        
    $.ajax({
        type: "POST",
        url: "CommonFunction.aspx/SaveToLike",
        data: '{user: ' + JSON.stringify(user) + '}',
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: function (response) {

            $(btnlike).attr("class", "btn btn-success");
            //  alert("Data added successfully.");

        },
        error: function (response) {
            alert("Unexpected error occurred.");
        }
    });
    return false;
}

aspx code

<asp:DataList ID="dtlist" runat="server" RepeatColumns="4" RepeatDirection="Horizontal" OnItemDataBound="dtlist_OnItemDataBound">
    <ItemTemplate>
        <asp:LinkButton ID="btnlike" runat="server" CommandArgument='<%# Eval("Id") %>'><i class="fa fa-users"></i></asp:LinkButton>
    </ItemTemplate>
</asp:DataList>

I just want to change other buttons cssclass. how to find the control?

Answer 1

You can find control ID Using Jquery in following manner.

$('#<%= dtlist.FindControl("btnlike").ClientID %>')

Hope it helps.

Answer 2

You can loop all the LinkButtons in the DataList with jQuery.

$('#<%=dtlist.ClientID%> a').each(function (i, obj) {
    $(this).addClass("btn btn-success");
});

Answer 3

chaning button color not working inside ajax call. changed like below , now working as expected.

$(function () {

    $('[id*=btnlike]').click(function () {
        $('[id*=btnlike]').attr("class", "btn btn-white");
    });
});

on click reset each button to white color.