JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<div class="container">
<button type="submit" id="2" class="submit btn">submit</button>
<ul class="list">
</ul>
</div>

CSS

.list {
  list-style: none;
}

JavaScript

$(function(){

	var list = $('.list');
	var submit = $('.submit');
	var people = '1';

	submit.on('click',function(){
		people++;
		list.empty();

		$.ajax({

			type: 'GET',
			url: 'https://swapi.co/api/people/' + people + '/',

			success: function(data) {

				list.append('<li>Name:' + data.name + '</li>');
				list.append('<li>Height:' + data.height + '</li>');
				list.append('<li>Mass:' + data.mass + '</li>');
				list.append('<li>Gender:' + data.gender + '</li>');
				list.append('<li>Movies:' + data.films + '</li>');

			}

		})

	})

})