Search code examples
htmldjangobootstrap-4

Random Line of Carets in HTML Page

I'm making a web app with Django, bootstrap, HTML, CSS, and JS. I'm generating some API results to a table using template building in Django. In between an H1 for the table and the table, there is this random line of carets. When I inspect them, it can't find an element in the DOM. Here's the code for the h1 and table start:

{% if body %}
<a href="#results"></a><h1 style="display: flex;flex-direction: column;justify-content: 
center;text-align: center;">RESULTS</h1>
{% endif %}
<table id="searchResults" class="table .table-hover" width="100%">

And here's a screenshot of the issue:

enter image description here

EDIT: Here's what's in the table:

{% if body %}
<a href="#results"></a><h1 style="display: flex;flex-direction: column;justify-content: center;text-align: center;">RESULTS</h1>
{% endif %}
<table id="searchResults" class="table table-hover" width="100%">
  {% if body %}
  <thead>
    <tr>
      <th>Song</th>
      <th>Artist</th>
      <th>Link</th>
    </tr>
  </thead>
  {% endif %}
  {% for result in body %}
  {% if result.position <= 9 %}
  <tr name="1">
  {% endif %}
  {% if result.position > 9 %} 
  <tr style="display:none" name="2">
  {% endif %}
  {% if result.position > 19 %} 
  <tr style="display:none" name="3">
  {% endif %}
    <td>{{ result.title }}</td>>
    <td>
    {% for artist in result.artists %}
    {{ artist }}
    {% endfor %}
    </td>
    <td><a href='{{ result.url }}'><img src="{{ result.image }}" height="64" width="64"><br>Go to {{ result.platform }}</a></td>
  </tr>
  {% endfor %}
</table>
Solution 
  • <td>{{ result.title }}</td>>

    While closing <td> you have added extra >. Replace your code with this :

    <td>{{ result.title }}</td>