title: Change div html content clicking on menu
body: <p>Got the next menu:</p>
  
  <pre><code>   &lt;div id="mySidenav" class="sidenav"&gt;
       &lt;a href="javascript:void(0)" class="closebtn" onclick="closeNav()"&gt;&amp;times;&lt;/a&gt;
       &lt;a href="http://www.myweb1.com" id="menu"&gt;Web1&lt;/a&gt;
       &lt;a href="http://www.myweb2.com" id="menu"&gt;Web2&lt;/a&gt;
       &lt;a href="http://www.myweb3.com" id="menu"&gt;Web3&lt;/a&gt;
       &lt;a href="http://www.myweb4.com" id="menu"&gt;Web4&lt;/a&gt;
     &lt;/div&gt;
  </code></pre>
  
  <p>And the next div container with an opened web by default:</p>
  
  <pre><code>&lt;div id="main"&gt;&lt;/div&gt;
  
  &lt;script&gt;
      $("#main")
          .html('&lt;object data="http://www.myweb1.com"/&gt;');
  &lt;/script&gt;
  </code></pre>
  
  <p>I want to change this default main web when you click the menu option, so I'm trying something like:</p>
  
  <pre><code>&lt;script&gt;
  $(document).on("click", "#menu", function(e) {
  
      /*$("#main").load("main.html");*/
  
      if ($("#menu").text() == "Web1"){
          $("#main").html('&lt;object data="http://www.myweb1.com"/&gt;');
      }
      if ($("#menu").text() == "Web2"){
          $("#main").html('&lt;object data="http://www.myweb2.com"/&gt;');
      }
      if ($("#menu").text() == "Web3"){
          $("#main").html('&lt;object data="http://www.myweb3.com"/&gt;');
      }
      if ($("#menu").text() == "Web4"){
          $("#main").html('&lt;object data="http://www.myweb3.com"/&gt;');
      }
  
      });
  
  &lt;/script&gt;
  </code></pre>
  
  <p>I'm new to jquery, sorry if It's an obvious question.</p>