title: How to use element id as JS function parameter in `onclick` function?
body: <p>I'm trying to use my an anchor tag as a button running a JS function when clicked.</p>
  
  <p>HTML - </p>
  
  <pre><code>&lt;a  class="ghost-button-transition" href="#" onclick="navforward(about)" style="margin-right:5px;"&gt;About me&lt;/a&gt;
  </code></pre>
  
  <p>JS - </p>
  
  <pre><code>function navforward(name){
    var str = "#"+String(name);
    $("#intro").fadeOut(1000).delay(1500);
    $(str).fadeIn(1000);
  }
  </code></pre>
  
  <p>Whenever I click on my <code>&lt;a&gt;</code> tag I get the following error in the console - </p>
  
  <blockquote>
    <p>Error: Syntax error, unrecognized expression: #[object HTMLDivElement]</p>
  </blockquote>
  
  <p>Now I understand that this is happening because my <code>navforward</code> function is treating the <code>name</code> parameter as an object and hence can't really use it as a handle to call the respective HTML element. But why isn't it working even after converting the parameter to a string?</p>
  
  <p>I have also tried- <code>onclick="navforward("about")</code> and <code>onclick="navforward("#about")</code> but they also gave errors.</p>
  
  <p>How do I get this working?</p>