AJAX - Actualizar las variables mostradas (de sesión) con ajax

Hola! Antes que nada muchas gracias por su ayuda y agradezco su paciencia ya que soy nuevo en el mundo web y en el uso de ajax.

Mi consulta no se si sea algo sencillo pero he intentado casi todo lo que se me ha ocurrido y nada funciona. Les explico a grandes rasgos, así como una descripción de mi código y una captura de pantalla de lo que quiero:

Resulta que hice un sistema en el cual el usuario necesita registrarse, y luego iniciar sesión con su correo y contraseña guardadas en la base de datos. Mi sistema básicamente usa PHP y MySQL como manejador.
Pusé una opción para poder modificar los datos de su perfil (Nombre, correo y contraseña) y los modifica bien, el problema resulto cuando me di cuenta que cada que daba sumbit a un formulario para uno de esos cambios se recargaba la página y aunque la base se actualizaba, en la vista no cambiaban los datos y era molesto la recarga de la página. Ahí descubrí Ajax con Jquery.

Ahora este sistema de actualización de datos ya usa Ajax, no se recarga la página y se guardan los datos en la base inmediatamente, pero no logro que se actualicen los datos en la vista (ver imagen adjunta como referencia).

Algo a tomar en cuenta es lo siguiente:

- El nombre del usuario lo muestro en todas las páginas o perfil con una variable de sesión que declaro cuando el usuario hace login y lo hago de este modo: <?php echo $_SESSION['MM_Nombre’]; ?>

- En mi archivo PHP cuando hago la consulta de actualizar, asigno el valor del input a la variable de sesión.

- Los echo que muestran el nombre guardado con la variable de sesión solo se modifican si salgo de la sesión y hago login de nuevo.

- Intente guardando el valor del input en una cookie (se me ocurrió guardarlo en una cookie para imprimir el valor de la cookie y no de la variable de sesión, aunque no se si ayude... ) y que cuando termine la consulta de actualizar imprima el valor de la cookie para ver si se guardo pero siempre me imprime el valor que guarde anteriormente, es decir: Mi nombre actual es Jorgito, antes de recargar la página había puesto Albertito, ahora quise cambiar mi nombre a Alberto y me imprimió Albertito y obviamente los otros echo no se actualizaron.

En general… ¿Cómo puedo hacer que la variable que actualice mediante PHP, MySQL y Ajax se actualice inmediatamente en donde se este mostrando?

Espero haberme explicado, muchas gracias!

Mi código:

PHP

<?php require_once('../../Connections/miconexion.php'); ?>
<?php

if (!isset($_SESSION)) {
session_start();
}

$editFormAction = $_SERVER['PHP_SELF'];
if (isset($_SERVER['QUERY_STRING'])) {
$editFormAction .= "?" . htmlentities($_SERVER['QUERY_STRING']);
}

mysql_select_db($database_miconexion, $miconexion);
$usuarioNombre=$_POST['nom'];
$year = time() + 31536000;
mysql_query("UPDATE usuarios_pro set name='$usuarioNombre' where id_usuario={$_SESSION['MM_ID']}")or die(mysql_error());
$_SESSION['Name'] = $usuarioNombre;

if(!empty($_POST)) {
setcookie('Remember_nom', $_POST['nom'],$year);
}
elseif(empty($_POST)) {
if(isset($_COOKIE['Remember_nom'])) {
$past = time() - 100;
setcookie(Remember_nom, gone, $past);
}
}



echo $_COOKIE['Remember_nom'];
?>

AJAX

$("#fname_pro").on("submit", function(e){
e.preventDefault();
$.post("../../../dist/php_files/update_username_pro.php", $("#fname_pro").serialize(), function(respuesta){
$("#actualizado").html(respuesta);
});
});



});

HTML

<form class="form-signin" name="fname_pro" id="fname_pro" >


<div class="row">
<div class="col-md-3">
<h3 class="visible-md visible-lg">Name: </h3>
</div>
<div class="col-md-9">
<div class="form-group has-feedback">
<input id="nom" name="nom" type="text" class="form-control input-lg" >
</div>
</div>
</div>

<div id="actualizado">
</div>

<div class="form-group">
<button type="submit" class="btn btn-warning btn-lg btn-lg-round" ng-disabled="fname_pro.$invalid">Save my changes</button>
</div>


</form>