title: Disabling HTML button with JavaScript when text reaches min/max size
body: <p>Sorry if the title doesn't explains well, I have this page, with two buttons and a text block, one is for increasing the size of that text and the other for decrease it.
  I want to disable each button when text reaches maximum or minimum size. For example:</p>
  
  <p>Click "Bigger" button, if text reaches max size, disable the button.
  Click "Smaller" button, if text reaches min size, disable the button.</p>
  
  <p>I tried using the next if statement inside the onclick function: </p>
  
  <pre><code>    if(currentSize== "66.6667pt"){bigger.disabled=true;}
  </code></pre>
  
  <p>where 66.6667pt was the size the text reached before staying fixed. The other case, the minimun size was 6.75pt.</p>
  
  <p>I don't know if there is a better way of verifying if a text reached its min/max size, but this way I'm doing it doesn't work, "bigger" button is getting disabled the second time the text reached 66.6667pt, "smaller" button never gets disabled.</p>
  
  <p>This is the entire html:</p>
  
  <pre><code>    &lt;!DOCTYPE html&gt;
      &lt;html&gt;
  &lt;head lang="es"&gt;
    &lt;title&gt;Find Bug Script&lt;/title&gt;
    &lt;meta charset="utf-8"&gt; 
    &lt;style&gt;
    &lt;/style&gt;
    &lt;script&gt;
       window.onload=function(){ 
  
            var smaller = document.getElementById("smaller");
            var hello = document.getElementById("hello");
            if(!hello.style.fontSize){hello.style.fontSize="12pt";} 
            var factor=0.75;
            bigger.onclick=function(){
  
               var currentSize=hello.style.fontSize;
              if(currentSize== "66.6667pt"){bigger.disabled=true;}
               var csz = parseInt(currentSize.replace("24pt", ""));
               if(csz &gt; 60) return;
               csz/=factor;
               hello.style.fontSize= csz+"pt";
  
  
            }
            smaller.onclick=function(){
  
               if(hello.style.fontSize== "6.75pt"){smaller.disabled=true;}
               var currentSize=hello.style.fontSize;
               var csz = parseInt(currentSize.replace("24pt", ""));
               if(csz &lt;= 6) return;
               csz*=factor;
               hello.style.fontSize= csz+"pt";
            }
  
       };
    &lt;/script&gt;
  &lt;/head&gt;
  &lt;body&gt;
      &lt;input type=button value="Bigger" id="bigger"/&gt;
      &lt;input type=button value="Smaller" id="smaller" /&gt;
      &lt;h1 id="hello" maxlength="5"&gt;¡Hello!&lt;/h1&gt;
  &lt;/body&gt;
  </code></pre>
  
  <p></p>
  
  <p>This is from my first HTML/JS class so, let's try to learn it well.
  Thanks for your time!</p>