Using xhr

Clicking the button will use xhr to get content from 'data.html' and insert it into the element.

  x$('#button1').click(function(){
    x$('#content').xhr('data.html');
  });

Using xhrjson

Clicking the button below will fetch some JSON data and insert the nodes directly into the DOM using the map option to know where the nodes populate.

  x$('#button2').click(function(){

    var options = {};
    
		options.map = { 
			'fname':'#fname',
			'lname':'#lname',
			'noun':'#noun'
		};
    
    x$('#content2').xhrjson('data.json',options);
  });

More fun with xhrjson

Lets build off the previous example, lets say we want to capitalize all the data coming back from the server.

  x$('#button3').click(function(){
    var options = {};
    
		options.map = {
			'fname':'#fname1',
			'lname':'#lname1',
			'noun':'#noun1'
		}
    
		options.callback = function(x) { 
			return x.toUpperCase(); 
		}
		
    x$('#content3').xhrjson('data.json',options);
  });