One more correct way to do this would be the following..
So you can see that the main difference is the use of some simple css ( cursor: pointer; ) which gives you the effect of appearing to “link” to something. The whole linking design is a good way to just make your functions easier for users to find (verses the regular arrow cursor). However, the problem with the incorrect method that I mentioned is that search engines tend to find your site and scan links. When they scan links with addresses such as “#” they usually rank your pages lower. Using css can help you avoid causing poor search results for your site. Also, some browsers are not designed to follow links such as “#” and often just reload the current page. You don’t want your page reloading instead of performing the script that you thought you correctly called for..do you?
So it’s best to just follow safe methods and standards to ensure that your code lasts longer and is supported in most all browsers without having to do silly browser specific hacks. These hacks can often become out dated very fast and force you to do hacks to your hacks. If you’d like to check into other web standards take a look at W3C. If you have any comments or suggested articles please let me know!