Question

Ok so this i probably very easy but i can’t seem to figure it out. I have a a function but i still have to call the function inline. I am wondering if there is a way to put it all in the function. Right now my function looks like this:

function ddItem(el) {
 $(el).closest(".ddSelectHeader").find("input").attr({
    value : $(el).text()
})
 }

Then i call this function inline like this:

<div class="ddContainer">
<div class="ddSelectHeader"><input name="" type="text" />
<div class="ddSubmenu">
  <a href="#" onclick="ddItem(this)">Item 1</a><br />
  <a href="#" onclick="ddItem(this)">item 2</a>
  </div>
</div>

Ok so i am trying to make a simple drop down but with divs instead of the traditional ul li. The way it is written above works fine but i was hoping there is a way to take the onlcick out so that any link that is click within the ddSubmenu will populate the input field. This way i don’t have to call it inline or in the html.

Thanks for the help.

Answer 1

$(document).ready(function() {
    $(".ddSubmenu a").click(function(){
        var $this = $(this);

        $this.closest(".ddSelectHeader").find("input").val($this.text());
    });
})