JSFiddle - React, Tailwind, and code Playground

HTML

<p class=a>Выпадающие сиськи:</p>
<div>
  <asp:DataList ID="b" runat="server">
    <input list="b"><datalist id="b"></datalist>
  </asp:DataList>
</div>

Выбери из списка или введи своё значение.

CSS

.a{
  display: inline; padding: 5px;
  background: rgba(255, 0, 255, 0.1);
  cursor: pointer;
}

input{
  width: 100%; height: 48px; padding-left: 16px;
  box-sizing: border-box;
}

div{
  width: 100%; height: 80px;
  background: rgba(0, 0, 255, 0.1);
  overflow: scroll;
}

JavaScript

var a = ['плоские', 'маленькие', 'средние', 'большие'];

$.each(a, function(i){
	$('<option value='+a[i]+'>').appendTo('#b');
});

$('.a').click(function(){
  var myVar = $('input').val();
  alert(myVar);
});