Data reappears after a few seconds when "JSON Remove button" is pressed

I'm currently in the process of creating a HTTP web service that will return data in JSON, XML and String formats. When entering a string and pressing "JSON Search" it will return data back from a database stored in Google SQL. However when I press the "JSON Remove" button next to the "JSON Search" button the data is cleared and then reappears after a few seconds. a br tag between the buttons seems to resolve the issue but messes around with the layout which I don't want to happen.

Here is the current code:

<hr>
        <fieldset>
            <legend>JSON, XML, String Search:</legend>
            <form id="jsonSearch" name="jsonSearch">
                <label for="json-film-title">Enter Film Name:</label> <input
                    type="text" id="json-film-title" name="film" />
                <button type="submit"> JSON Search</button>
                <button value="films-json" class="clearButton"> JSON Remove</button>
            </form>
            <br> <br>
            <div id="films-json"></div>
        </fieldset>

enter image description here