// Get all information between 2 ID

Version beta, checkbox change state not include

by Nexus Fred

HTML

<form name="myform" method="post">
<span id="start" name="start" class="start"></span>   
	<input id="input_id" name="input_name" value="input_value" type="input" class="inputClass"><br>
	<a id="href_id" name="href_name" href="https://jsfiddle.net" target="_blank" alt="hrefAltText">href text</a><br>
	<img id="img_id" name="img_name" src="https://jsfiddle.net/img/logo.png" width="100" height="100" border="0">
			
	<table id="table_id" name="table_name" cellpadding="5" cellspacing="2" border="1" width="100%">
		<tr id="tr_1_id" name="tr_1_name">
			<td id="td_id" name="td_name" class="td_class">
				<div id="div_id" name="div_name" class="div_class1 div_class2 div_class3">Lorem ipsum dolor sit amet</div>
				<button id="button_id" name="button_name" type="button" value="button_value">myButton</button><br>
				<input id="checkbox_id" name="checkbox_name" value="checkbox_value" type="checkbox" class="checkbox_Class" checked="checked"><label for="checkbox_id" id="checkbox_label_id" id="checkbox_label_name" class="label_class">checkbox one</label><br>
				<input id="radio_id" name="radio_name" value="radio_value" type="radio" class="radioClass"><label for="radio_id" id="radio_label_name" id="radio_label_id" class="label_class">radio one</label><br><br>
			</td>
			<td>
				<div id="inside_div_1_id" name="inside_div_1_name" class="inside_div_1_class">
					<div id="inside_div_2_id" name="inside_div_2_ame" class="inside_div_2_class">inside div 2 text :*)</div>
					inside div 1 text !!
				</div>
			</td>
		</tr>
	</table>

	<div id="level_1_id" name="level_1_name" class="level_1_class">
		<div id="level_2_1_id" name="level_2_1_name" class="level_2_1_class">level 2 div 1 text ;*)</div>
		<div id="level_2_2_id" name="level_2_2_name" class="level_2_2_class">level 2 div 2 text ;*)</div>
		<div id="level_2_3_id" name="level_2_3_name" class="level_2_3_class">
			<div id="level_3_1_id" name="level_3_1_name" class="level_3_1_class">level 3 inside div 3 text :*)</div>
				level...

CSS

.informations{
	border: 1px solid red;
}
.get_infos{
	float: right;
}

JavaScript

// Get all information between 2 ID
// start = first id name
// end = second id name
// carriage = return type| ex '<br>', '<p>' ...
// 
// Usage between 2 id #start_id & #end_id	
// var all_infos = get_all_id( '#start', '#end' );
// or
// Usage between 2 class .start_id & .end_id	
// console.log( get_all_id( '.start', '.end' ) );
function get_all_id( start, end, carriage = '\n' ){
	
	var all_id 			= []; // Set array to store all id
	var informations 	= '';
	
	// Scan all id for children
	function scan_all_id( item ){
		if( item.id != '' ){ // if is not a elements without id
			all_id.push( item.id ); // Add a new id to array
		}
		// Scan all element children to find the next id
		$( item ).children().each(function(n, i) {
			scan_all_id( this ) //  Recursion
		});
	};
		
	// Scan all id between start & end
    $( start ).nextUntil( end ).each( function(){ 
		scan_all_id(this);
    });
    
	// Uppercase first letter
	String.prototype.ucfirst = function(){
		return this.charAt(0).toUpperCase() + this.substr(1);
	}
	
	// Print all informations about each id
    $.each( all_id, function( key, id ) {
    	informations += 'Element N°: '+ key + carriage ;// Place of the element
    	informations += 'TypeOf: ' + $( '#'+id ).prop( 'nodeName' ) + carriage; // TypeOf - IMG, A - TABLE etc
		
		// Scan all_id array
    	Array.prototype.slice.call( document.getElementById(id).attributes ).forEach( function( item ) {
    		informations += item.name.ucfirst() + ': '+ item.value + carriage ;
    	});
		
		// Retrieve only text not nested in child tags
		// Thanks "DotNetWala" 
		// URL: "http://stackoverflow.com/questions/3442394/jquery-using-text-to-retrieve-only-text-not-nested-in-child-tags"
		var text =$( '#'+id )
				.clone()    // Clone the element
				.children() // Select all the children
				.remove()   // Remove all the children
				.end()  // Again go back to selected element
				.text(); 
		
		informations += 'Text: '+ $.trim(text) + carriage;
    	informations +=...