Change background color in an input from ajax-CodePudding

I have the following code, where when selecting a value in the select returns a date to put in the input.

$('#title1').change(function(){
  var data = {"title1":$('#title1').val(),
  "title":$("#title").val()};
  $.ajax({
    type:"POST",
    url:"./atribdatt1",
    dataType:"Json",
    data:data,
    success:function(callback){
      var data_array = callback;
      artdat = data_array
      $("#vali1").html(artdat);
      document.getElementById('vali1').value = artdat;
    }
  });
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<div >
  <label for="title1" >NOME VISITANTE</label>
  <div >
    <select name="title1"  id="title1">
      <option></option>
      <?php
      $sql = "SELECT * FROM raddb.Utente WHERE ativo = '1' AND codigo NOT IN ('701', '723') ORDER BY nome ASC";
      $qr = mysqli_query($conn, $sql);
      while($ln = mysqli_fetch_assoc($qr)){
      echo '<option value="'.$ln['codigo'].'">'.$ln['nome'].'</option>';
      }
      ?>
    </select>
  </div>
</div>
<div >
  <input type="date" name="vali1"  id="vali1" readonly="true">
</div>

I intended that if the returned date is less than two days from the current date, put the input in red. This way it always returns only the date but does not change the color of the input. Can you help?

CodePudding user response：

So, for access styles from JavaScript DOM elements have a style prop. The names of styles in javascript is camelCase keys in style. https://api.jquery.com/css/
Usage:

const element = $("selector") // or on vanilla document.querySelector('selector')
// ...
element.css('background', 'red') // vanilla - element.style.background = 'red'