Display list data across site collections in script editor webpart

I am using the script below to display list data in same site collection,I have 2 site collections Test A,Test B.I need to display list residing in Test A to display in Test B in script editor webpart..Below is the script i m using for same site collection..How can i do cross site collection

<script src="http://code.jquery.com/jquery-1.7.1.min.js" type="text/javascript"></script>

<style>
.ww{
    border: 0.5px solid black;
}
</style>   
<div id="dvMessage">
<table id="tblcategories" class="ww">
</table>
</div>

<script type="text/javascript">
$( document ).ready(function() 
{
debugger;
ExecuteOrDelayUntilScriptLoaded(OnPageLoadFetachItems, "sp.js");
});

function OnPageLoadFetachItems(sender, args)
{
try
{
debugger;
var appCtxSite = new SP.ClientContext(); 

var web = appCtxSite.get_web(); //Get the Web 
 
var list = web.get_lists().getByTitle("CategoryList"); //Get the List
 
var query = new SP.CamlQuery(); //The Query object. This is used to query for data in the List
 
query.set_viewXml('<View><RowLimit></RowLimit>10</View>');
 
var items = list.getItems(query);
 
appCtxSite.load(list); //Retrieves the properties of a client object from the server.
appCtxSite.load(items);
 
var table = $("#tblcategories");
var innerHtml = "<tr><td class='ww'>ID</td><td class='ww'>Category Id</td><td class='ww'>Category Name</td></tr>";
 
//Execute the Query Asynchronously
appCtxSite.executeQueryAsync(
Function.createDelegate(this, function () {
var itemInfo = '';
var enumerator = items.getEnumerator();
while (enumerator.moveNext()) {
var currentListItem = enumerator.get_current();
innerHtml += "<tr><td class='ww'>"+ currentListItem.get_item('ID') +"</td><td class='ww'>" + currentListItem.get_item('Title') + "</td><td class='ww'>"+ currentListItem.get_item('CategoryName')+"</td></tr>";
}
table.html(innerHtml);
}),
Function.createDelegate(this, fail)
);
}
catch(err)
{
alert(err);
}
}
function fail(sender, args)
{
alert ('Fetch Failed !');
}

</script>