title: Update CSS in JavaScript / jQuery
body: <p>The following code is an example of open and close actions of a sidebar, where some CSS values should be updated to correctly show the sidebar.</p>
  
  <pre><code>function openNav() {
      document.getElementById("sidebar").style.width = "250px";
      document.getElementById("mainContent").style.marginLeft = "250px";
      document.getElementById("codePanel").style.marginLeft = "10px";
  }
  
  function closeNav() {
      document.getElementById("sidebar").style.width = "0";
      document.getElementById("mainContent").style.marginLeft = "0px";
      document.getElementById("codePanel").style.marginLeft = "40px";
  }
  </code></pre>
  
  <p>Now I ask myself if there is a better way to do this if I eg update more different styles? </p>
  
  <p>Because in this code, I would need to add more and more similar looking lines of code which looks really clunky.</p>