He revisado ¿Cómo puedo cambiar el texto dentro de mi <span> con jQuery? para llegar a donde estoy. Sin embargo, eso no cubre los botones creados dinámicamente.
Estoy creando botones dinámicamente que contienen una etiqueta.
$("<button type='button' id='" + this.patExeId + "' name='exerciseMachine' class='btn exeBtn btn-large col-lg-2 col-md-2 col-sm-2 col-3 m-1 p-3' " + "value='" + this.exeName + "'>" + this.exeName + " <span class='label label-light label-as-badge'>0</span></button>").appendTo($("#allExercises"));Los tres valores "this.patExeId" son
Quiero actualizar la etiqueta a medida que se completan las series de ejercicios. Estoy usando este código de prueba que se activa cuando se hace clic en el botón:
$('#'+$(this).attr('id')+ ' span').html('3');Esto está desencadenando un error que se muestra en el registro de la consola:
jquery.min.js:2 Uncaught Error: Syntax error, unrecognized expression: #OA== spanDado que, en su caso, está creando un selector como #id span pero el elemento que está utilizando para capturar la identificación es this , por lo que puede hacerlo más simple y seleccionar directamente un elemento dentro de ese usando find()
$(this).find('span').html('3'); Pero para abordar mejor su primera preocupación, estaba usando un selector con una identificación que contenía caracteres especiales. El = tiene un significado especial en CSS, por lo que debe escaparse si necesita incluirlo literalmente. Para hacer un ejemplo muy simple que muestre que, si tuviera un elemento con id #0== , debería usar el siguiente selector:
$('#O\\=\\=')Y esta sería una solución alternativa a su problema solo por mostrar mi punto:
$('#' + $(this).attr('id').replace(/=/g, '\\=') + ' span').html('3');