*Not sure why my prev message isn't showing up, so posting again. Thanks Karl, I tried using the functions you suggested, but now I think using id's is the best approach... Earlier I wasn't keen on using them because I want to dynamically generate/delete list items...
Any way.. All I have is a dropdown with a list that changes the div container below. http://cattails.biz/js/jq/try.html Problems I'm having now: 1. Need the dropdown to appear on hover instead of click 2. The hover needs to have a lag after the mouseout. Some stickyness that is.. Also how can I load forms via Ajax, is it easy enough..? Hints are good too.. Just show me the right way and I will do my research. Thank you for reading the problem.. Harsh On May 15, 7:01 pm, "Karl Rudd" <[EMAIL PROTECTED]> wrote: > Why don't you want do this "without naming ids and classes"? > > My recommendation would be to use something like this: > > $(function() { > var targets = $('[EMAIL PROTECTED]'); > if ( !targets.length ) return; > > var firstTarget = targets[0]; > var pageLinks = $('[EMAIL PROTECTED]"#"]'); > > targets > .hide() > .each( function() { > var target = $(this); > function showTarget() { > targets.hide(); > target.show(); > return false; > } > $(pageLinks) > .filter('[EMAIL PROTECTED]"#' + this.id + > '"]') > .click( showTarget ); > > if ( this == firstTarget ) > showTarget.apply( firstTarget ); > }); > > }); > > You use it like this: > > <html> > <head> > <script type="text/javascript" src="jquery.js"></script> > <script type="text/javascript" src="hashShow.js"></script> > <title>Test</title> > </head> > <body> > <p><a href="#section1">Show "Section 1"</a></p> > <p><a href="#section2">Show "Section 2"</a></p> > <div class="hashShow" id="section1"> > <h1>Section 1</h2> > </div> > <div class="hashShow" id="section2"> > <h1>Section 2</h2> > </div> > </body> > </html> > > There's also an added advantage that should JavaScript be not > available the links will still "work". > > I'll be putting this into a more flexible plugin format a little > later. If anyone's interested let me know. > > Karl Rudd > > On 5/16/07, [EMAIL PROTECTED] d <[EMAIL PROTECTED]> wrote: > > > > > Hi there, I just started to working on jQuery and am finding it > > extremely easy to use. However I've been trying to find a solution to > > a simple navigation problem here.. > > > My markup has a list with a few 'li' items. So for each click on a > > list item it would show the respective div container and hide the > > rest... > > > <!-- List Menu --> > > > <div id="dropbox"> > > <ul> > > <li>Cash</li> > > <li>Personal Assets</li> > > <li>Certificates of Deposit</li> > > </ul> > > </div> > > > <!-- Div Containers --> > > > <div class="formcash"> > > <h2>Cash</h2> > > </div> > > > <div class="formpersonal"> > > <h2>Personal Assets</h2> > > </div> > > > <div class="formdeposit"> > > <h2>Certificates of Deposit </h2> > > </div> > > > Can I some how do the toggle without naming ids and classes? > > > Any ideas people?