CODEWITHSUNDEEP
jqueryhtml
minimallinux
minimallinux

Reputation: 139

jQuery add a simple data attribute to specific li id and class

This probably won't excite anyone too much but I thought I'd ask as I've tried a number of ways to do this. I am just trying to add a data attribute to a menu item which activates the drop-down facility in the nav in Wordpress. (UIKit CSS/JS) The HTML for the element is

 <li class="uk-parent" data-uk-dropdown="{mode:'click'}">

The uk-parent class has already been added as have the sub ul classes necessary for it to work, leaving just the data-uk-dropdown mode to be added. I've tried addClass, appendTo and a few others but can't get it to register. The id of the li is "menu-item-140" and I only need to target this one, not any others. So typically I have at the moment, going back to addClass (but it's not really a class.) as below:

jQuery(document).ready( function($) {
$("#menu-item-140.uk-parent").addClass("data-uk-dropdown='{mode:'click'}");
$('.sub-menu').addClass('uk-dropdown uk-dropdown-navbar');
});

before trying to add the data-uk-dropdown, the .sub-menu classes showed up fine, but as it is at present this actually makes the sub item disappear from the menu altogether, leaving just the parent items.

Any Tips welcome, Thanks

Upvotes: 0

Views: 426

Answers (1)

Wreigh
Wreigh

Reputation: 3287

addClass is for adding a class, to actually add an attribute, use attr

$("#menu-item-140.uk-parent").attr("data-uk-dropdown", "{mode:'click'}");

Upvotes: 1

Related Questions