Get data attribute value JavaScript – How to Get the data-id Attribute of an Element Using jQuery?

Get data attribute value JavaScript Use the jQuery attr() Method. also you can use this jquery attr() syntax for get data-id attribute value.

Get data attribute value JavaScript – How to get value of data attribute and use it in jQuery?


jQuery Get Data Text, Id, Attribute Value Example


<!DOCTYPE html>
<html lang="en">
<title>jQuery Get the data-id Attribute -</title>
    ul li{ 
        display: inline-block;
        margin: 19px;
        list-style: none;
        opacity: 0.8;
    ul li:hover{
        opacity: 1;
<script src=""></script>
    $(".portfolio li").on("click", function(){
        var dataId = $(this).attr("data-id");
        alert("The data-id of clicked website is: " + dataId);
    <ul class="portfolio">
        <li data-id="1">
            <a href="#">
                <img src="images/pakainfo.jpg" alt="pakainfo">
        <li data-id="2">
            <a href="#">
                <img src="images/w3school.jpg" alt="w3school">
        <li data-id="3">
            <a href="#">
                <img src="images/infinityknow.jpg" alt="infinityknow">
        <li data-id="4">
            <a href="#">
                <img src="images/blog.jpg" alt="blog">

Don’t Miss : jquery get data attribute

Also Read This 👉   javascript Converting Strings to Number Example

I hope you get an idea about Get data attribute value JavaScript.
I would like to have feedback on my
Your valuable feedback, question, or comments about this article are always welcome.
If you enjoyed and liked this post, don’t forget to share.