Problems calling jQuery function from within normal JavaScript function

Tried looking at other solutions but they don't quite answer my question so here goes.

The code below shows me declar开发者_Python百科ing an anonymous function to run when the document is ready which contains another function relating to a plugin which creates a horrizontal accordion. That function takes in certain properties and one property, eventAction, allows you to define a function and I've tried to call the jQuery AJAX load function but it does not work.

<script type="text/javascript">
    $(document).ready(function() {
        $(".accordion").hrzAccordion({
            openOnLoad: 6,
            fixedWidth: 648,
            eventAction: function(){
                $("#accordionContent0").load("hips.html");
            }
        });
    });
</script>

When I place the line $("#accordionContent0").load("hips.html"); outside of the $(".accordion").hrzAccordion function, but still with the ready function, it works fine.

Any ideas what I'm doing wrong by calling the load function inside the other function?

Thanks.

Try this:

<script type="text/javascript">
    $(document).ready(function() {
        $(".accordion").hrzAccordion({
            openOnLoad: 6,
            fixedWidth: 648,
            eventAction: function(){
                loadAcc($(".accordion"));
            }
        });
    });

function loadAcc(acc) {
  $("#accordionContent0").load("hips.html");
}
</script>