I have integrated a listview control in my ASPX page. The data is being fetched from the database and displayed in the listview. I have also utilized jQuery script to implement the .fadein() and .fadeout() effects on the listview elements. However, when I add another listview control with the same class to the webpage, the script only works for one of them. The content of the second listview control remains hidden with display:none.
Is there a way to apply the same jQuery script to multiple elements with the same class name?
ASP code:
<asp:ListView ID="ListView1" runat="server" RepeatLayout="Flow" RepeatDirection="Horizontal" OnItemCommand="ListView1_OnItemCommand" OnItemDataBound="ListView1_ItemDataBound">
<LayoutTemplate>
<div class="ticker twoRows medium">
<ul class="latestNews">
<asp:PlaceHolder runat="server" ID="itemPlaceholder" />
</ul>
</div>
</LayoutTemplate>
<ItemTemplate>
<li>
<asp:LinkButton ID="lnkTitle" runat="server" Text='<%# Eval("NewsTitle") %>'></asp:LinkButton>
<asp:LinkButton ID="lnkDesc" runat="server" Text='<%# Eval("NewsDescription") %>'></asp:LinkButton>
</li>
</ItemTemplate>
</asp:ListView>
jQuery script:
var initializerRegion = function () {
startTicker('.latestNews', 1, 3000);
};
$(function () {
initializerRegion();
});