JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<p id='data'>

</p>

JavaScript

var arry = [
	{
		'id': 301, 
		'name': '2 Foo', 
		'open': 'open',
		'children': [
			{
				'id': 1313, 
				'name': '2.1 Foo ', 
				'open': 'open'
			}, 
			{
				'id': 1143, 
				'name': '2.3 Foo ', 
				'open': 'open'
			}, 
			{
				'id': 1132, 
				'name': '2.2 Foo ', 
				'open': 'open'
			}, 
		], 
	},
	{
		'id': 30, 
		'name': '1 Foo', 
		'open': 'open',
		'children': [
			{
				'id': 1134, 
				'name': '1.1 Foo ', 
				'open': 'open'
			}, 
			{
				'id': 1130, 
				'name': '1.3 Foo ', 
				'open': 'open'
			}, 
			{
				'id': 1123, 
				'name': '1.2 Foo ', 
				'open': 'open'
			}, 
		], 
	},
];


function SortByName(a, b){
  var aName = a.name.toLowerCase();
  var bName = b.name.toLowerCase();
  return ((aName < bName) ? -1 : ((aName > bName) ? 1 : 0));
}


$(document).ready(function(){
var sorted_array = arry.sort(SortByName)
	console.log(sorted_array)	
})