Jquery go to next element

Question

I am trying to use the following jquery function to click a link to go to the next element in an unordered list. What I have is below, but I get a 404 message that it cannot find [object Object]

$('.next').click(function (event) { window.location = $('li').next(); }); 

and

 <div id="nextButton"><a href="#" class="next" id="next">&gt;</a></div> 

Answer 1

If you placed your code exactly as it is, there are many syntax errors. Fixed version below:

 $('.next').click(function (event) { // missing $/jQuery window.location = $('li').next(); }); // missing the close parentheses 

Also, since you are doing things with jQuery, you may need to use something like:

 // where selector is the selector for the element you are scrolling to $(window).scrollTop(selector.position().top); 

EDIT

If it is horizontal, you only need to adjust the scroll code. eg:.

 $(window).scrollLeft(selector.position().left); 

EDIT No. 2

Here is a very simple example of what I think you are trying to achieve:

http://jsfiddle.net/FsjkM/

Click on the HTML part and it will move to the next element of the list (note the change in number).

In your real application, you will need to track or calculate the “current” element in order to use the previous / next functionality.

Ultimate EDIT

http://jsfiddle.net/FsjkM/1/

I modified this a bit to give you an idea of ​​what a more complete structure would look like. Note that border checking does not exist - if you press prev at the beginning or at the end, it will break.

Answer 2

There are several problems in the code.

• $ ('li') will return all elements of 'li', so $ ('li'). next () will return an array. You need a selector to indicate the current selection.

• next () will return the element, this is not necessarily internal html. you can use next (). html () I think this was your intention. But this does not mean that it will work. Continue reading further. :-)

• window.location accepts a url string (e.g. "http://www.google.com"), not an html link (e.g. <a href="http://www.google.com">Google</a> )

Hope this helps