javascript - Converting UL to SELECT - grabbing 'data-attr' not working -

So I'm working on a mobile version of a market selector, clicking on a continent shows the available country and then the country Clicking on provides available languages.

Clicking on a language had the href data-val "http://linkhere.com" button in the original based on the original But for some reason it is not pulling.

I am trying to set the value to option which was its original data-val when it was Was still, but it is not working as you can see jsfiddle:

How do I drag it into the original data-val ARR? What I'm not doing (line 68 in JSfield)

Edit: I have also tried the data ('wall') - and it does not pull it in any form.

Sorry my code is such a mess, I'm still learning.

Sample code here:

  $ ('section ul', this $ Element). Hide (); // Create dropdown base $ ("& lt; selection />").appendTo("www.continents", this. $ Element); // go to the default option "$" ("", {"selected": "selected", "value": "", "text": $ ('continents. Of SPAN selected ', this. $ Element) .text ()}) .andand ("select continents", this. $ Element); Delete the dropdown with // menu item $ (". Continents li one", this. $ Element) Reed (function () {var el = $ (this); $ ("& lt; option / & gt;", {"value": El.attr ("href"), "text": el.text () }). Attachments ("Select continents", this. $ Element);}); $ (". Select continents", this $ Element) .change (function () {// Select the selected item var var = $ (this) .find ("option: selected"). Val (); // When choose change, make this $ ("& lt; selection />int).appendTo('countries', this. $ Element); // Create default option" Go to ... "$ (" & lt ; Option / & gt; ", {" selected ":" selected "," value ":" "," text ": $ ('country span.sected', this $ Element) .text ()}) Set the dropdown with AddendTo (Select "Select Country", this. $ Element); // menu item $ (selectVal + "li one", this. $ Element) .each (function () {varel = $ (this ); $ ("& Lt; option / & gt;", {"value": el Attr ("href"), "text": el.text ()}. Attachments ("Select country", this $ Element);}); $ ("Select countries.", This $ Element) .change (function () {// Select the selected item var var = $ (this) .find ("option: selected"). Val (); // When the changes are selected, this is $ ("& lt; Select />").appendTo('.languages', this. $ Element); // Create default option "Go to ..." $ ("& lt; option / & gt;", {" Selected ":" selected "," value ":" "," text ": $ ('. Languages ​​selected ', it $ Element) .text ()}) Append ("Select languages.", This $ Element); // Populate the dropdown with menu item $ (selectVal + "li a"). Each (function () {var el = $ (this); $ ("& lt; option />, {" value ": el.attr ('data-wall')," text ": el.text ()}) .app (select ". Languages", this. $ Element);}); $ (". Choose language", this $ Element) .change (function () {var selectVal = $ (this) .find ("option: selected"). Val (); $ ('# release', this $ Element) .removeClass ('disabled'); $ ('# release', this. $ Element) .attr ('href', selectVal);}); }); });  

Your L jsfiddle has an anchor element, and < Code> Data is set on the attribute list item.

To read the value of the list item, when the anchor is given, do this:

  Var value = el.closest ('li'). Data ('val');