There's a lot of Stack Overflow questions on this topic, but none seem to work for me.

This may be due to the fact that I need a PHP function called when the div is refreshed in order for the information to be updated.

I have a #tab-project-CD-smt_test div that shows three versions (production, staging, and latest). The user can click an arrow next to the staging or latest to move it up the chain. I have this part working fine through the use of an AJAX request:

    function sendToStaging (dir, type, subtype, version) {

        //Need selected category, selected type, selected subtype 

        $.ajax({

            type: 'POST',

            url: 'configs.php',

            data: 'function=sendToStaging'+'&dir='+dir+'&type='+type+'&subtype='+subtype+'&version='+version, 

            success: function() {

//                 window.location.reload(true);

                $('#deployed').load(document.URL);

            }

        });



    };



    function sendToProduction (dir, type, subtype, version) {

        //Need selected category, selected type, selected subtype 

        $.ajax({

            type: 'POST',

            url: 'configs.php',

            data: 'function=sendToProduction'+'&dir='+dir+'&type='+type+'&subtype='+subtype+'&version='+version

        });

On success, I would like to refresh the #deployed div, which is created in my PHP makeInfoSection. An excerpt of which is below:

// list latest, staging, production

$html .= '<h4>Deployed Versions</h4>';

$html .= '<ul class=list-group id=deployed>';



$html .= '<li class=list-group-item>';

$html .= '<span class=badge>production</span>';

$html .= $production.'</li>';



$html .= '<li class=list-group-item>';

$html .= '<span class=badge><a href=# style=color:orange><span class=glyphicon glyphicon-arrow-up aria-hidden=true onclick=sendToProduction('.'$dir', '$type', '$subType', '$staging'.')></span></a></span>';





$html .= '<span class=badge>staging</span>';

$html .= $staging.'</li>';



$html .= '<li class=list-group-item>';

$html .= '<span class=badge><a href=# style=color:orange><span class=glyphicon glyphicon-arrow-up aria-hidden=true onclick=sendToStaging('.'$dir', '$type', '$subType', '$latest'.')></span></a></span>';







$html .= '<span class=badge>latest</span>';

$html .= $latest.'</li>';

$html .= '</ul>'; 

The method is called in the HTML:

<div class=col-md-5 col-md-push-1 col-sm-6>

        <div id=tabs class=tab-content style=padding:0em 0em 0em 1em>

            <?php

                foreach ($project_types as $type) {

                    // @TODO remove once folder structure is all setup

                    if ($type !== 'CD') continue;



                    foreach ($project_subtypes[$type] as $subType) {

                        $html = <div role ='tabpanel' class='tab-pane';

                        $html .= id='tab-project-.$type.-.$subType.'>;

                        $html .= makeInfoSection($type, $subType, $project_versions[$subType], $project_dir);

                        $html .= </div>;

                        echo $html;

                    }

                }



                foreach ($workflow_types as $type) {

                    foreach ($workflow_subtypes[$type] as $subType) {

                        $html = <div role ='tabpanel' class='tab-pane';

                        $html .= id='tab-workflow-.$type.-.$subType.'>;

                        $html .= makeInfoSection($type, $subType, $workflow_versions[$subType], $workflow_dir);

                        $html .= </div>;

                        echo $html;

                    }

                }

            ?>

        </div>

    </div>

</div>

So upon the success of the AJAX, I need this to be refreshed. I've tried $('#tab-project-CD-smt_test').load(document.URL); but that doesn't seem to do anything. I've also tried calling the makeInfoSection method but that does not add it to the HTML, so I'm not surprised that it didn't work:

$approved_functions = array('sendToProduction', 'sendToLatest', 'sendToStaging');

if(array_key_exists('function', $_POST) && in_array($_POST['function'], $approved_functions)) {

    // call the approved function

    $dir = $_POST['dir']; 

    $type =  $_POST['type']; 

    $subType = $_POST['subtype']; 

    $version = $_POST['version']; 

    $_POST['function']($dir, $type, $subType, $version);

    makeInfoSection($type, $subType, $versions, $dir); 

}

Any ideas on how to get this div to refresh?