title: Changing all buttons class on condition with JS or JQUERY
body: <p>I have a div with buttons:</p>
  
  <pre><code>&lt;div id="buttonWrapper"&gt;
  &lt;button id="x"&gt; X &lt;/button&gt;
  &lt;button id="y"&gt; Y &lt;/button&gt;
  &lt;button id="z"&gt; Z &lt;/button&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>When you enter the page, there is a JQuery function that load userPreferences to a table called options. It's simple table, where buttons id from above have a value.</p>
  
  <pre><code>options = {x: "1", y: "1", z: "0"}
  </code></pre>
  
  <p>and I want to change class of elements on condition: when in options value is 1 button gets class 'active'. I got something like this:</p>
  
  <pre><code>$("#buttonWrapper").find("button", function () {
                  if (options[$(this).attr("id")] != null &amp;&amp; options[$(this).attr("id")] == "1"){
  
                      $(this).className += " active";
                  };
                  return false;
              })
  </code></pre>
  
  <p>and It doesn't work. No errors, just simply doesn't work. What am I doing wrong?</p>
  
  <p>On same page I have second part of this function, that attaches action on click to buttons:</p>
  
  <pre><code>.click(function () {
                  modalPreferencesSave($(this).attr("id"), $(this).hasClass("active") ? "0" : "1");
                  return false;
              });
  </code></pre>
  
  <p>and second part works like charm - action is assigned, and works just fine. Only adding style won't work:/</p>
  
  <p>So the whole function looks like this :</p>
  
  <pre><code>$("#buttonWrapper").find("button", function () {
                  if (options[$(this).attr("id")] != null &amp;&amp; options[$(this).attr("id")] == "1"){
  
                      $(this).className += " active";
                  };
                  return false;
              }).click(function () {
              modalPreferencesSave($(this).attr("id"), $(this).hasClass("active") ? "0" : "1");
              return false;
          });
  </code></pre>
  
  <p>First part - don't work - don't change style,, second part successfully adds onClick action</p>