Przypisywanie value do diva z event.target

Question

Napisałem swojego selecta i chciałbym, aby do diva valueHolder została wpisana wartość zawarta w target, czyli jednej z klikniętych opcji z selecta. Przepisywanie tekstu działa, ale niestety wartości już nie.

$('#A').find('div.valueHolder').text(target.text());
$('#A').find('div.valueHolder').val(target.val());

<div id="A" class="btn">
<div class="valueHolder" value="">Tekst</div>
</div>

A tu jakaś przykładowa opcja: 

<div class="dropOption" value="1">Opcja 1</div>

Chciałbym, aby value="1" z dropOption zostało przepisane do valueHoldera. Jak to zrobić?

 

A tu reszta kodu:

  var container = $('#A .dropContainer');

  $('#A').on('click', function(event)
  {
    var target = $(event.target);

    if(target.hasClass('valueHolder') || target.attr('id') === '#A')
    {
      container.show();
      document.getElementById("A").style.borderColor = "#FFAC0D";   
    }
    else if(target.hasClass('dropOption'))
    {
      $('#A').find('div.valueHolder').text(target.text());
      $('#A').find('div.valueHolder').val(target.val());
      container.hide();
      document.getElementById("A").style.borderColor = "#DDD";
      showElements();
    }
  });

Czyli otwieranie okna i zamykanie po wyborze opcji.

Comments

Napisałem swojego selecta

Mówisz że napisałeś selecta, a użyłeś diva. Może po prostu wystarczy zamienic to na selecta:

<select id="A" class="btn">
  <option class="dropOption" value="1">Opcja 1</option>
</select>

 

---

Znaczniki <select></select> to standardowy select, który ma mało opcji do edycji w css, dlatego napisałem swojego selecta za pomocą divów. ;) Ale już sobie poradziłem z problem. Użyłem data-value zamiast value.