capturar y remover valores

[stevens82]

Hola amigos de forosdelweb, estoy haciendo un pequeño script que captura los valores de unos inputs mediante jquery, el caso es el siguiente los cuadros al dar click que colorean y capturan su valor y al dar nuevamente click sobre dicho cuadro se descolorea, pero no me elimina el valor capturado, ya que luego lo enviare a un BD con php que ya es otro tema, el asunto era como elimnar ese valor capturado este es mi codigo

Código HTML:

<div class="contenedor">
            <?php for ($i = 1;$i<=16; $i++ ) { ?>
            <div class="diente"><!--diente 1-->
                <input name="diente1" type="hidden" value="<?php echo  $i; ?>">
 
                <div class="cuadro centro">
                    <input name="cuadro" type="hidden" value="<?php echo  "centro_" . $i; ?>">
                </div>
 
                <div class="cuadro izquierda">
                    <input name="cuadro" type="hidden" value="<?php echo  "izquierda_" . $i; ?>">
                </div>
 
                <div class="cuadro derecha">
                    <input name="cuadro" type="hidden" value="<?php echo  "derecha_" . $i; ?>">
                </div>
                <div class="cuadro arriba">
                    <input name="cuadro" type="hidden" value="<?php echo  "arriba_" . $i; ?>">
                </div>
                <div class="cuadro abajo">
                    <input name="cuadro" type="hidden" value="<?php echo  "abajo_" . $i; ?>">
                </div>
                <div class="numero"><?php echo $i; ?></div>
            </div>
 
            <?php } ?>
            
        </div>
        <div class="respuesta"></div>
 

el div respuesta lo hice a modo de prueba, eso se eliminará luego.

Código Javascript:

$(".cuadro").click(function(){
 
        var cuadro = $(this).find("input[name=cuadro]:hidden").val();
        $(this).toggleClass("num4");
        $(".respuesta").append(cuadro + "<br>");
 
    });
 

Espero alguien me pueda ayudar Gracias de antemano!!..