custom-data-attribute

I'd like to write a simple jQuery plugin that displays inline modals under specified elements. My idea is for the script to auto-init based on data attributes specified on elements. A very basic example: <p data-modal-target>Hover over me for an inline modal!</p> <div data-modal-content data-modal-align="right" data-modal-trigger="hover" data-modal-offset="10px"><!-- any desired syntax can go here --></div> I'm just wondering if data-modal-target in the above example is valid, or does it have to be data-modal-target="true" ? I don't care about anything crappier than IE9 etc, my only

I have a div with an attribute data-myval = "10" . I want to update its value; wouldn't it change if I use div.data('myval',20) ? Do I need to use div.attr('data-myval','20') only? Am I getting confused between HTML5 and jQuery? Please advise. Thanks! EDIT: Updated div.data('myval')=20 to div.data('myval',20) , but still the HTML is not updating. HTML <div id="mydiv" data-myval="10"></div> JS var a = $('#mydiv').data('myval'); //getter $('#mydiv').data('myval',20); //setter Demo Reference From the reference: jQuery itself uses the .data() method to save information under the names 'events' and

I've got the following field on an MVC view: @Html.TextBoxFor(model => model.Course.Title, new { data_helptext = "Old Text" })</span> In a seperate js file, I want to set the data-helptext attribute to a string value. Here's my code: alert($(targetField).data("helptext")); $(targetField).data("helptext", "Testing 123"); The alert() call works fine, it shows the text "Old Text" in an alert dialog. However, the call to set the data-helptext attribute to "Testing 123" does not work. "Old Text" is still the attribute's current value. Am I using the call to data() incorrectly? I've looked this up

I would like to know what selectors are available for these data attributes that come with HTML5. Taking this piece of HTML as an example: <ul data-group="Companies"> <li data-company="Microsoft"></li> <li data-company="Google"></li> <li data-company ="Facebook"></li> </ul> Are there selectors to get: All elements with data-company="Microsoft" below "Companies" All elements with data-company!="Microsoft" below "Companies" In other cases is it possible to use other selectors like "contains, less than, greater than, etc...". $("ul[data-group='Companies'] li[data-company='Microsoft']") //Get all