JSFiddle - React, Tailwind, and code Playground

by richardneililagan

HTML

<div id="container">
This will change to the raw AJAX response
</div>

<div id="formatted">
This will change to the formatted AJAX response
</div>

CSS

html, body {
    background:#ddd;
    padding:10px;
}
div {
    margin:10px; padding:20px;
    background:white;
}

JavaScript

jQuery(function ($) {
    
    var _container = $('#container'),
        _formatted = $('#formatted'),
        _ajax = $.ajax({
            url : '/echo/html/',
            type : 'POST',
            data : { 
                html : '<p>hello <span>world!</span></p>', 
                delay : 3
            },
        });
    
    _ajax.success(function (m) {

        // pagkatapos ng isang AJAX request na nag-e-expect ka ng HTML response,
        // puwede mong i-display agad yung HTML
        _container.html(m);        
        
        // ... or puwede mo i-manipulate muna yun like so:
        var _html = $(m);
        _html.find('span').text('Kuya Nico!');
        
        _formatted.html(_html);
        
    });
    
    
    
    
    
});