diveman1 on "URL Json API coding"

Hi everyone, I'm hoping you can help me with this. I have a custom made API (made by someone else) that I need to implement on a site. The API uses Json and is accessible via URL's. The problem is I don't know the best way to put it into action in Wordpress. It should display a clothing list and clothing details for a particular piece of clothing. Can anyone give any advice, or make any recommendations on how to get this to work? Thanks in advance for your help. Here's what I have so far:

-----Begin------
<script	src="resources/js/jquery-1.10.2.js"></script>
<input type="button" onclick="ajaxtest1()" value="getAllClothing"> &nbsp; &nbsp; Clothing List &nbsp; &nbsp;<select id="clolist"></select><br/>
<br/>
<input type="text" id="cloid"><input type="button" onclick="ajaxtest2()" value="getClothingDetails"><br/>

<div id="test1"></div>
<script>
	var headerdata = {};
	headerdata["auth"] = "1234567890987654321qwerty";

	function ajaxtest1() {
		var data = {
			"consumerName" : "microsite",
			"serviceName" : "getClothingList"
		};
		ajaxCall(data, headerdata,ClothingList)
	}

	function ajaxtest2() {
		var cloid=$("#cloid").val();
		var data = {
			"consumerName" : "microsite",
			"data" : "{\"ClothingId\" : \""+cloid+"\"}",
			"serviceName" : "getClothingDetails"
		};
		ajaxCall(data, headerdata,ClothingDetails)
	}

	function ClothingList(data) {
		var obj=JSON.parse(data)
		var list=obj.ClothingList;
		$("#clolist").html("");
		if(list.length==undefined){
				$("#clolist").append(new Option("--No Clothing--", ""));
		}else if(list.length>0){
				$("#clolist").append(new Option("--Clothing--", ""));
			$.each(list, function (i, val) {
				$("#clolist").append(new Option(val.ClothingName,val.ClothingID));
			});
		}
	}

	function ClothingDetails(data) {
		$("#test1").html("");
		var obj=JSON.parse(data)
		var clo=obj.clothing;
		console.log(clo);
		$("#test1").append("Name : <span>"+clo.ClothingDisplayName+"</span><br/>")
		$("#test1").append("Color : <span>"+clo.clothingColor+"</span><br/>")
		$("#test1").append("Sizes : <span>"+clo.clothingSizes+"</span><br/>")
	}

	function ajaxCall(data, headerdata,callback) {
		$.ajax({
			type : "POST",
			url : "http://1.1.1.1:8111/meh/api/apiService",
			data : data,
			headers : headerdata,
			crossDomain : true,
			success : callback,
			error : function(data, status) {
				alert("Error  " + status);
			}
		});
	}
</script>
---------End