SharePoint Accordion not loading properly

I am working on a SharePoint page, utilizing the jslink for the list web part. I have the following code written out:

(function () {
    var overrideCurrentContext = {};
    overrideCurrentContext.Templates = {};

    overrideCurrentContext.Templates.Header = "<div class='ListAccordion'>";
    overrideCurrentContext.Templates.Footer = "</div>";

    overrideCurrentContext.OnPostRender = OnPostRender;
    overrideCurrentContext.Templates.Item = ItemTemplate;

    SPClientTemplates.TemplateManager.RegisterTemplateOverrides(overrideCurrentContext);

})();

function ItemTemplate(ctx) {

    var Title  = ctx.CurrentItem["Title"];
    var Body = ctx.CurrentItem["Body"];

    return "<h2>" + Title + "</h2><p>" + Body + "</p><br/>";
}

function OnPostRender() {

    $('.ListAccordion h2').click(function () {
        $(this).next().slideToggle();
    }).next().hide();

    $('.ListAccordion h2').css({
    "background-color": "#0B0B61",
    "cursor": "pointer",
    "color": "white" ,
    "border-radius" : "15px",
    "padding-left" : "10px"
    });

}

The problem I am having, is that my accordion view will not display until I utilize the manual refresh option, or I wait for the Asynchronous Automatic Refresh both under the AJAX option of the web part properties.

The accordion shows up perfect, until I save, or reload the page, but it works if I utilize the ajax options. Is there anything I can do to make sure the accordion shows right away when the page is first opened?

also I have the file saved in my siteassets and this is the link I am using ~site/SiteAssets/Accordions12.js

Add the following to the header of your script editor but replace the middle parts with what your file/location is

<script src="/_catalogs/masterpage/test1/jquery-1.11.2.min.js" type="text/javascript"></script>