I guess I will start with a piece of code
See the Pen focusin and focusout demo in jquery by Prateek Jadhwani (@prateekjadhwani) on CodePen.
Here you will see in the JavaScript that you need to target the parent element of a particular element. Well, if you love writing logic in JavaScript, this might be a good solution. But thankfully, there is a new spec that lets you do the same using css. Yup, pure css. It is called the :focus-within pseudo class.
Here is the demo of this pseudo class.
See the Pen :focus-within demo by Prateek Jadhwani (@prateekjadhwani) on CodePen.
As you can see here, there is no JavaScript used in the demo. Instead the pseudo class :focus-within is used on the parent class to add the property.
This is relatively a new spec that exists on Chrome, Chrome Canary and Firefox Nightly at the time of writing. If you would like to read more about the spec, feel free to refer this link.