HTML

<!DOCTYPE html>
<html>
<head>
<title>x</title>
<link rel='stylesheet' href="x.css"/>
<link rel='icon' href="x.png">
</head>
<body>
<div class="logo">
	<a href=""><img class="logo-img" src="x.png"/></a>
</div>
<div class="navigation">
	<nav>
		<ul>
			<li><a class="indent">a</a></li>
			<li><a class="navigaton-elements" id="nav-1" href="">1</a></li>
			<li><a class="navigaton-elements" id="nav-2" href="">2</a></li>
			<li><a class="navigaton-elements" id="nav-3" href="">3</a></li>
		</ul>
	</nav>
</div>

<div id="test-div">
	<input type="text" id="search"/>
	<button type="submit" onclick="query()">Submit</button>
	<button type="submit" onclick="newInput()">New</button>
	<button type="submit" onclick="remove()">Delete</button>
	<button type="submit" onclick="deleteAll()">Delete All</button>
		<div class="query-div"><p class="query-p">Test-a</p></div>
		<div class="query-div"><p class="query-p">Test-b</p></div>
		<div class="query-div"><p class="query-p">Test-ba</p></div>
<p id="child"></p>
</div>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="x.js"></script>
<script src="x2.js"></script>
</body>
</html>