Javascript does not work with HTML5

Question

In my project, I started implementing some new html5 features (standards, nothing unusual). Only standard header, footer, sideways, ect. For some reason, the javascript code that I used in the last project is now not working, and I cannot figure out what the problem is.

I compared the code (html / javascript) with my new project and the previous project (with javascript working), and I see no difference. The only thing I can think of is a change in the html versions.

By the way, I'm trying to implement a script that selects the current link from a menu. It is supposed to use javascript to add / remove ".selected" code of anchor tags in the menu and refers to the current page and link.

here is the code:

<aside>
        <section>
            <Strong>Quick Links</strong>
                <menu id="side_menu">
                    <ul>
                        <li><a href="application.php">Sign Up</a></li>
                        <li><a href="testimonials.php">Testimonials</a></li>
                        <li><a href="diploma.php">The Process</a></li>
                        <li><a href="diploma.php">Course Listings</a></li>
                        <li><a href="about.php">American High School</a></li>
                     </ul>
                </menu> 

        <script>
            $(document).ready(function() {
                var loc = window.location.href; // The URL of the page we're looking at
                $('#side_menu a').each(function() {
                    if (loc.indexOf(this.href) !== -1) { // If the URL contains the href of the anchor
                            $(this).addClass('selected'); // Mark it as selected
                    }
                });
            });
        </script>

        </section>
</aside> 

( )

. , . .

gdinari

Answer 1

, Prototype, . script js/prototype.js script js/drop-o-matic.js.

(Chrome Dev Tools, Firebug Firefox, script Debugger IE,...), . , , Chrome Dev Tools Uncaught TypeError: Object #<an HTMLDocument> has no method 'observe', — DOM , , document.observe Prototype.

---

, , Uncaught TypeError: Object #<an HTMLDocument> has no method 'ready'. , jQuery jQuery:

$(document).ready(function() {
    var loc = window.location.href; // The URL of the page we're looking at
    $('aside li a').each(function() {
        if (loc.indexOf(this.href) !== -1) { // If the URL contains the href of the anchor
            $(this).addClass('selected'); // Mark it as selected
        }
    });
});

jQuery, Prototype, , , Prototype:

document.observe("dom:loaded", function() {
    var loc = window.location.href; // The URL of the page we're looking at
    $$('aside li a').each(function(link) {
        if (loc.indexOf(link.href) !== -1) { // If the URL contains the href of the anchor
            link.addClassName('selected'); // Mark it as selected
        }
    });
});

jQuery , jQuery jQuery.noConflict, Prototype $ ( jQuery, jQuery, jQuery ).