Немного странная структура html.
Если вам надо, чтобы у вас была кнопка, которая чистит значение в инпут и при этом сам инпут был внутри этой кнопки, то лучше сделать так
<button class="button-third">
<input type="text" class="input-third" />
X
</button>
document.querySelector(".button-third").addEventListener("click", (evt) => {
console.log("button click")
});
document.querySelector(".input-third").addEventListener("click", (evt) => {
evt.stopPropagation();
console.log("input click")
});
Чтобы события с дочернего элемента не поднимались вверх и не вызывали родительские, вам необходимо использовать stopPropagation()
Документация:
тык 
