livesLeft... js

Good afternoon all. I need some help with my script. I got 3 lives total. if i lose one the number of lives foes from 3 to 1. So my script is like this:

function OnTriggerEnter (collider:Collider) { if(enable){ Destroy(collider.transform.gameObject); if(livesLeft > 0) { livesLeft --; lives.text = "" + livesLeft; }

So i tried to add hearts instead of a number to display the total of hearts and i edited and added the following:

       if(livesLeft >= 3)
     {
         livesLeft --;
         lives.text = "" + livesLeft;
         Hearts3.active = true;
     }

         if(livesLeft >= 2)
     {
         livesLeft --;
     lives.text = "" + livesLeft;
     Hearts3.active = false;
         Hearts2.active = true;
         
     }
     if(livesLeft >= 1)
     {
     livesLeft --;
         lives.text = "" + livesLeft;
     Hearts3.active = false;
     Hearts2.active = false;
     Hearts1.active = true;
     }
     if(livesLeft >= 0)
     {
     livesLeft --;
         lives.text = "" + livesLeft;
         Hearts3.active = false;
     Hearts2.active = false;
     Hearts1.active = false;
     Hearts0.active = true;
     }

Now if i lose only 1 life it goes from 3 hearts to 0 hearts. Can anyone help me out here please? :)