jquery - CSS y JS no aplicados después de que se llama al documento listo?

Question

Estoy intentando trabajar con los manillares JS y hasta ahora está trabajando en su mayoría. Sin embargo, he encontrado un problema interesante.

Estoy intentando hacer que los manillares representen un formulario de entrada de usuario con tres campos de texto. Para las pruebas, he pegado a mi documento, la cadena JSON necesitaba construir esos tres campos de texto y funciona con bellamente. Sin embargo, cuando uso $ .getjson y llamo a la misma cadena JSON a través de AJAX cuando hace que los campos de texto no se aplican las reglas CSS o jQuery a la forma.

Sé que se debe a que el documento de hecho listo ha sido llamado por este punto, ya que agregué un documento listo alrededor de mi cadena estática y lo mismo sucedió que no hicieron ninguna regla CSS o JS.

¿Hay alguna manera de poder revenir todas las reglas de jquery y CSS para actualizar? o ¿cómo puedo hacer esto para trabajar?

Además, tenga en cuenta que esto es no jquery movible.

Muchas gracias de antemano .. y por favor pregunte si tiene alguna pregunta antes de bajar la votación.

Editar - Aquí está el código:

versión estática

var source   = $("#form-template").html();
var template = Handlebars.compile(source);
var data = { 
    info: { id: 'longbeach2012', name: 'Long Beach 2012' },
forms: [
{id: "1", label: "This is a label", description: "", type: "text", name: "t1", username: "alan" },
{id: "2", label: "This is a label2", description: "description2", type: "text", name: "t2", username: "allison" },
{id: "3", label: "This is a label3", description: "description3", type: "text", name: "t3", username: "ryan" }
]};
var example = {title: "Sample Title", body: "Sample Body"};
$("#testForm").html(template(data));

versión dinámica

$.getJSON('http://register.local.dev/fetchtemplate',
{
    language: 'english',
    formid: 'longbeach2012'
},
function(data) {
    $.each(data, function(i,item){
        if( item.elem_type === 'text' )
        {
            var source = $("#textinput-template").html();
            var template = Handlebars.compile(source);
            $("#testForm").append(template(item));
        }
    });
});

plantilla de manillares

<script id="textinput-template" type="text/x-handlebars-template">
<div id="q{{elem_id}}">
    <div class="small">{{trans_label}}{{#if trans_description}}</br />
    <span class="notice">{{trans_description}}</span>{{/if}}</div>
    <input type="{{elem_type}}" name="{{elem_name}}" id="{{elem_name}}" value="{{trans_defaultValue}}" tabindex="1" autocomplete="off" />
</div>

Answer 1

lo entendí.

Sentí la mayor parte de mi código JavaScript de un documento listo y tenía mi función de GetJson, que ejecutó el resto de mi JavaScript después de que Getjson había terminado de ejecutar.