Change colour of submit button when text is entered into field

Question

Is there a way to change the colour of the submit button when text is entered? Didn't know if this was possible without the use of JavaScript (not a very proficient coder!).

CSS:

#a { 
    padding: 1px 3px 0px; 
    background: transparent; 
    border: 0; 
    outline: 0; 
    border-bottom: 0.8px solid #D3D3D3; 
    width: 300px;
    height: 32px;
}

.bttn {
    background-color: #FF0783;
    border: none;
    color: #ffffff;
    text-align: center;
    text-decoration: none;
    font-size: 24px;
    width: 216px;
    height: 48px;
    border-radius: 38px;
    text-transform: none;
}

HTML:

<div style="text-align: center;"><input type="text" id="a" style="text-transform:uppercase; font-family: open-sans, sans-serif; font-style: normal; font-weight: 300; color: black; font-size: 24px; text-align: left;" maxlength="8" autofocus></div>

<div class="sbmt">
    <button type="submit" class="bttn">Continue</button>
</div>

Answer 1

Nope this is not possible through CSS. CSS has no (pseudo) selectors for value(s). Possible duplicate of this.

Answer 2

You can use js for change the submit class, or with jquery. Is easy: $('#id').removeClass('class'); $('#id').addClass('class');