title: jQuery error Cannot read property 'submit' of undefined
body: <p>I almost got everything working in this step in my code, however, the code works but for some reason still shows a console issue that I can't seem to fix. </p>
  
  <p>index.ejs</p>
  
  <pre><code>&lt;%- include("partials/header") %&gt;
  
  &lt;div class="container my-5"&gt;
      &lt;div class="row justify-content-center"&gt;
              &lt;div class="card bg-dark" style="width: 18rem;"&gt;
                  &lt;div class="card-header text-white"&gt;
                      To-Do List
                      &lt;a href="#collapseToDo" data-toggle="collapse"&gt;&lt;i class="fas fa-plus ml-auto"&gt;&lt;/i&gt;&lt;/a&gt;
                  &lt;/div&gt;
  
                  &lt;ul class="list-group list-group-flush"&gt;
                      &lt;div class="collapse" id="collapseToDo"&gt;
                              &lt;form class="" action="/" method="POST"&gt;
                                  &lt;input class="list-group-item bg-light rounded-0" name="todo" type="text" placeholder="Enter To-Do"/&gt;
                              &lt;/form&gt;
                      &lt;/div&gt;
                      &lt;% todos.forEach(function(todos){ %&gt;
                      &lt;li class="list-group-item"&gt;&lt;%= todos.title %&gt; &lt;form action="/&lt;%= todos._id %&gt;?_method=DELETE" method="POST"&gt;&lt;button&gt;&lt;i class="far fa-trash-alt"&gt;&lt;/i&gt;&lt;/button&gt;&lt;/form&gt;&lt;/li&gt;
                      &lt;% }) %&gt;
                  &lt;/ul&gt;
              &lt;/div&gt; 
      &lt;/div&gt;
  &lt;/div&gt;
  
  &lt;%- include("partials/footer") %&gt;
  </code></pre>
  
  <p>dom.js</p>
  
  <pre><code>$("ul").on("click", "button", function(event){
      $(this).parent().parent().fadeOut(500, function(){
          $(this).remove();
      });
      event.stopPropagation();
  });
  
      $("input[type='text']").keypress(function(event){
          if(event.which === 13){
            var todoText = $(this).val(); 
            $(this).form.submit();
            $(".list-group").append("&lt;li class='list-group-item'&gt;" + todoText + "&lt;span&gt;&lt;i class='far fa-trash-alt'&gt;&lt;/i&gt;&lt;/span&gt;&lt;/li&gt;");
            $(this).val("");
          }
      });
  
      $(".list-group").on("click", "li", function(){ 
          $(this).toggleClass("completed");
      });
  </code></pre>
  
  <p>I can't seem to get <code>$(this).form.submit()</code> to work without any errors. I get the following error: Cannot read property 'submit' of undefined</p>
  
  <p>The weird thing is. The form does end up being succesfully submitted, however the next line in the eventlistener doesn't go through because of the error. Anyone who can help me out?</p>