Get HTML DOM elements inside a javascript function

Question

I am trying to implement something like this. IF you click the button it would get the HTML of the above elements and insert them in an alert :

<div id="0001">

    <h5 class="title">Hello World </h5>
    <h4 class="date">2014-07-19 </h4>

    <button onclick="addCalendar('#0001. #title','#0001. #date')"> Add to Calendar </button>
</div>    

<div id="0002">

    <h5 class="title">Bye Bye</h5>
    <h4 class="date">2014-07-22 </h4>

    <button onclick="addCalendar('#0002. #title','#0002. #date')"> Add to Calendar </button>
</div>

<script>
function addCalendar(title,date){
    alert(title + ": " + date);   
}
</script>

what do you mean by getting HTML full like this <h5 id="title">Hello World </h5> — Mritunjay
– Mritunjay, Commented Jul 19, 2014 at 9:05
An ID should be unique for the page. If you need to repeat a selector, the convention is to use a class. — DivinusVox
– DivinusVox, Commented Jul 19, 2014 at 9:14

Bla... · Accepted Answer · 2014-07-19 09:06:28Z

1

This code should works..

If you want to get the value of that HTML:

$("button").click(function(){
    var value = $(this).siblings("#title").text();
    value += $(this).siblings("#date").text();
    alert(value);
});

If you want to get the HTML tags too:

$("button").click(function(){
    var value = $(this).siblings("#title").html();
    value += $(this).siblings("#date").html();
    alert(value);
});

answered Jul 19, 2014 at 9:06

Bla...

7,2887 gold badges30 silver badges47 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Get HTML DOM elements inside a javascript function

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related