How to create a talkback api key with your html button?

I have a html code for my button together with javascript, i want to know how do i implement this with my javascript using talkback api key?

Javascript code;

<script

src="https://code.jquery.com/jquery-3.3.1.js"

integrity="sha256-2Kok7MbOyxpgUVvAk/HJ2jigOSYS2auK4Pfzbm7uH60="

crossorigin="anonymous"></script>

<script type="text/javascript">

$(document).ready(function(){

$("#boot .btn").click(function(){

$(this).button('Talk-Back');

});

$.post('https://api.thingspeak.com/talkbacks/35730/commands.json?apikey=JJHHMMITZ2TAK9PU&command_string=TalkBack Command&position=2');

});

</script>

HTML code;

<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous"><br/>

<div class="col-md-4 text-center">

<button id="singlebutton" name="singlebutton" class="btn btn-primary">Talk-Back</button>

</div>

</body>

Do i need to write C++ device application? I am still new to this environment as to say, i am more experienced in Azure, please help me.

[Vinod]

Stepping back from the details, can you describe what you are trying to do?

[Gcobani Mkontwana]

I want to create a plugin using a button to communicate with my talkback app. My button does not seem to connect to talkback app command.