Question

154

jQuery accordion() not working

rated 0 times [ 158] [ 4] / answers: 1 / hits: 23854 / 11 Years ago, tue, april 2, 2013, 12:00:00

My jQuery accordion() is not working on my HTML paragraphs. Where did I go wrong?

simple.html

<!DOCTYPE html>

<html>

    <head>

        <title></title>

    </head>

    <body>

        <div id=mainContent>

            <h1>This is an According Example</h1>           

        </div>

        <div id=accordion>

            <h3><a href=#>Heading for first sentence</a></h3>

            <div>

            <p>This is the first sentence.</p>

            </div>          

            <h3><a href=#>Heading for second sentence</a></h3>            

            <div>

            <p>This is the second sentence.</p>

            </div>

            <h3><a href=#>Heading for third sentence</a></h3>

            <div>

            <p>This is the third sentence.</p>

            </div>

        </div>

        <script src=//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js></script>

        <script src=//ajax.googleapis.com/ajax/libs/jqueryui/1.10.2/jquery-ui.min.js></script>

        <script src=myscript.js></script>

    </body>

</html>

myscript.js

window.onload = function(){

    $(#accordion).accordion();

};

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

loric

Add To Favorites

Follow

Total Points: 110

Total Questions: 96

Total Answers: 91

Location: Estonia

Member since Wed, Jun 8, 2022

2 Years ago

answered 11 Years ago tayaw · Accepted Answer

Use this...

<!DOCTYPE html>

<html>

    <head>

    <title></title>

<script src=//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js></script>

        <script src=//ajax.googleapis.com/ajax/libs/jqueryui/1.10.2/jquery-ui.min.js></script>

    <script src=myscript.js></script>

</head>

<body>

    <div id=mainContent>

        <h1>This is an According Example</h1>           

    </div>

    <div id=accordion>

        <h3><a href=#>Heading for first sentence</a></h3>

        <div>

        <p>This is the first sentence.</p>

        </div>          

        <h3><a href=#>Heading for second sentence</a></h3>            

        <div>

        <p>This is the second sentence.</p>

        </div>

        <h3><a href=#>Heading for third sentence</a></h3>

        <div>

        <p>This is the third sentence.</p>

        </div>

    </div>

</body>

And put this in the head tag

<script>

    $(document).on('ready', function(){

        $(#accordion).accordion();

    });

</script>

And see this jsFiddle example