Select action

by Santosh Thakur

HTML

<select name="" id="">
  <option value="One">One</option>
  <option value="Two">Two</option>
  <option value="Three">Three</option>
  <option value="Four">Four</option>
  <option value="Five">Five</option>
</select>

<div id="newTxt1" style="display:none">This is my value - one</div>
<div id="newTxt2" style="display:none">This is my value - Two</div>
<div id="newTxt3" style="display:none">This is my value - Three</div>
<div id="newTxt4" style="display:none">This is my value - Four</div>
<div id="newTxt5" style="display:none">This is my value - Five</div>

CSS

select {
  padding: 5px 10px;
}

JavaScript

var i = 0;
$('select').change(function(e) {
  i++;
  var x = e.target.value;
  if (x === i) {
  console.log('fine');
    document.getElementById('newTxt' + i).style.display = 'block'
    e.target.style.backgroundColor = '#FFCC00';
  } else {
   // document.getElementById('newTxt' + i).style.display = 'none'
    e.target.style.backgroundColor = '';
  }
  //console.log( $(this).find(":selected").text() );
});