title: How to add a class to an element when thead table was click in jquery?
body: <p>I want to add a class <strong>Open</strong> to <strong>li</strong> element on class <strong>Menus</strong> when user click on <strong>thead tr th</strong> of my table as below.</p>
  
  <p>This is my table</p>
  
  <pre><code>&lt;div&gt;&lt;ul&gt;
   &lt;li class="menus"&gt;
      &lt;a&gt;&lt;/a&gt;
      &lt;ul&gt;&lt;li&gt;
       &lt;table id="tableid "&gt;
          &lt;thead&gt;
            &lt;tr&gt;&lt;th&gt;&lt;/th&gt;&lt;th&gt;&lt;/th&gt;&lt;th&gt;&lt;/th&gt;&lt;/tr&gt;
          &lt;/thead&gt;
          &lt;tbody&gt;
              &lt;tr id="1"&gt;
                  &lt;td&gt;&lt;/td&gt;
                  &lt;td id="type1"&gt;types1&lt;/td&gt;
                  &lt;td&gt;&lt;/td&gt;
                  &lt;td id="types2"&gt;types2&lt;/td&gt;
                  &lt;td&gt;&lt;/td&gt;
              &lt;/tr&gt;
              &lt;tr id="2"&gt;
                  &lt;td&gt;&lt;/td&gt;
                  &lt;td id="type1"&gt;types3&lt;/td&gt;
                  &lt;td&gt;&lt;/td&gt;
                  &lt;td id="types2"&gt;types4&lt;/td&gt;
                  &lt;td&gt;&lt;/td&gt;
              &lt;/tr&gt;
             &lt;/tbody&gt;
         &lt;/table&gt;
      &lt;/li&gt;
    &lt;/ul&gt;
  &lt;/li&gt;&lt;/ul&gt;&lt;/div&gt;
  </code></pre>
  
  <p>JS</p>
  
  <pre><code>$(document).on('click','#tableid thead tr th', function(){
      var parents = $(this).prevAll().find('li')
      console.log(parents)
  
  });
  </code></pre>