Как заставить свойство фокуса оставаться, пока я не нажму другую кнопку

Question

Я ищу способ сохранить свойство "focus", пока я не нажму одну из других кнопок.

Обычно фокус исчезает, даже если я щелкаю где-либо еще, но мне нужно, чтобы он оставался, пока я не нажму только одну из других кнопок.

Решения, включающие JavaScript, также принимаются, но только без использования библиотек.

button:focus {
  color: red
}

<div class="example">
  <button>button 1</button>
  <button>button 2</button>
  <button>button 3</button>
  <button>button 4</button>
</div>

Answer 1

$("button").focusin(function(){
    $('button').css('color',''); // Remove Before set color to selected button
    $(this).css("color", "red"); // Set Color to Selected Button
});

button:focus {
  color: red
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="example">
  <button>button 1</button>
  <button>button 2</button>
  <button>button 3</button>
  <button>button 4</button>
</div>