html - jquery: Find first element by attribute -


i have list categories on left side on webpage, , list items on right side. list items have attribute called cat, , values numbers.

clicking on category should scroll me first item same categoryid.

any tips? :)

here html:

asp:repeater runat="server" id="repcategory" onitemdatabound="categoryitemrepeater">             <headertemplate>                 <ul class="menulistul">             </headertemplate>             <itemtemplate>                 <li>                     <div id="catitem" runat="server"></div>                 </li>             </itemtemplate>             <footertemplate></ul></footertemplate>         </asp:repeater>    <div id="menulist">             <asp:repeater runat="server" id="repfooditems" onitemdatabound="menuitemrepeater">                 <itemtemplate>                     <div class="menuitem" id="menuitem" runat="server">                         <div runat="server" class="itemnumber" id="itemid"></div>                         <div runat="server" class="itemname" id="itemname"></div>                         <div runat="server" class="itemdescription" id="itemdescriptionlbl"></div>                     </div>                 </itemtemplate>             </asp:repeater>          </div> 

codebehind:

categorylist:

var lbl = (htmlgenericcontrol)e.item.findcontrol("catitem");  lbl.attributes.add("catid",""+rest.categoryid); 

itemlist:

var menuitem = (htmlgenericcontrol)e.item.findcontrol("menuitem");             menuitem.attributes.add ("cat","cat"+item.item.category.firstordefault().categoryid); 

jquery:

$('.menulistul li div').bind('click', function ()         {             var catid = $(this).attr('catid'); //the categoryid on element clicked.               // now: find first element same cat id              var element = ""; element found.              $('html, body').animate({                 scrolltop: element.offset().top             }, 2000);         }); 

this select elements 'foobar' catid. seems want right?

$('.menulistul li div[catid="foobar"]') 

Comments