Cambiar div height con javascript

[pabloabran08]

Hola,
no sé si estoy en el lugar indicado pero tampoco se como se llama lo que quiero hacer.
Llevo un tiempo rompiéndome la cabeza con este código sin conseguirlo, así que recuro a solicitar su amable ayuda.

La idea es obtener un listado de elementos que consigo de una tabla sql.
Quisiera que cada elemento de la lista tenga una pestaña que se delegue al apretar un botón.
Algo así para cada elemento de la lista:

<Boton><Div que se deplega al apretar boton><elemento>

Tengo un código que funciona con los Div desplegables pero mi problema es que cuando aprieto un botón, sin importar el elemento que le corresponda, se despliegan todas las pestañas de todos los elementos.

Aquí les pongo mi código para que entiendan mejor la idea. El div desplegable es el que tiene la etiqueta class="panhora".

Código HTML:

<script>
(function($){
$(document).ready(function() {
$("div.panhora").height(0);
$("div.panhora_button").click(function(){
$("div.panhora").animate({
height: "50px",
opacity: 0.9
}, 1200);
$("div.panhora_button").toggle();
});
$("div#hide_button").click(function(){
$("div.panhora").animate({
height: "0px",
opacity: 0
}, 1200)
});
});
})(jQuery);
</script>

<style type="text/css">
.panhora {
    background-color:#BCBCBC;
    height:0px;
    width:200px;
    margin:10px;
    color:#fff;
	overflow:hidden;
}
</style>

<?php
$editFormAction = $_SERVER['PHP_SELF'];

$link = mysqli_connect('localhost', 'root', '', 'bdredsocial');
$consulta = "SELECT * FROM Tabla ORDER BY orden";
$resultado = mysqli_query($link, $consulta);
$elementos = null;
while ($datos = mysqli_fetch_assoc($resultado)){
	$elementos[$datos['id']] = '<div id="hora">
	<div class="panhora_button" style="display: visible; cursor:pointer;">ESTO ES UN BOTON(Abrir)</div>
	<div class="panhora_button" id="hide_button" style="display: none; cursor:pointer;">ESTO ES UN BOTON(Cerrar)</div>
	<div class="panhora" id="elemento-'.$datos['id'].'">Cambiar hora:<br />
		<form action=" '.$editFormAction.'" method="post" name="form1" id="form1">
		<table align="center"><tr valign="baseline">
		<td><input type="time" name="hora" value="" size="28" /></td>
		<td><input type="submit" name="Bonton1" id="Boton1" value="Actualizar" /></td></tr>
		</table>
		<input type="hidden" name="MM_insert" value="form1" />
		</form>
	</div>
</div>
<div id="Texto">'.$datos['Texto'].'</div>';
}?>
<ul id="lista"><?php
if(!empty($elementos)) {
	foreach ($elementos as $id => $elemento)
		echo '<li id="'.$id.'">'.$elemento.'</li>';
}?>
</ul> 

Se me ocurría que debería asignar un id a cada div "panhora" y de alguna forma recuperar este id con la función javascipt al presionar el botón correspondiente a ese elemento, pero eso es lo que no sé hacer

Si me pueden ayudar a resolver esto, se los agradecería un montoon!