Es posible que te falte definir el atributo class
en el div padre.
No sé tu estructura padre e hijos pero esto es a modo de prueba que así funciona.
Editado: Es lo mismo, esté donde esté la clase clickame
, o venga del script o sea estático, siempre y cuándo dentro del padre, funcionará igual. Por lo menos a mí y aquí funciona bien (Debes ver si no hay algún conflicto o llaves sin cerrar o algo en jQuery).
$("#test").prepend("<div class='clickame'>Hola</div>");
$("#test").on("click",".clickame",function(){
$(this).parents("div").toggleClass("active");
});
.padre {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
width: 100%;
height: 300px;
}
.padre.active {
background-color: red;
}
<div id="test" class="padre">
<div id="test" class="hola ">
<!-- <button class="clickame">clickame</button>-->
</div>
</div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
.active{ color: red;}
en tu css y le das click al elemento conclickame
te agrega la clase bien.active
sobre el padre cada vez que se pulsa sobre el textoHola
. Lo único que se me ocurre es que no te des cuenta porque elactive
no tenga ningún efecto visual en la página donde lo estas haciendo, pero si miras el código fuente pulsando el botón derecho sobre el textoHola
y seleccionando Inspeccionar en tu navegador, y lo haces varias veces verás como se agrega o elimina esa clase sobre el padre en la ventana del inspector.