getElementsByClassName

[Andy11548]

Hey, I'm very new to Javascript/jQuery.

 

How would I make this work:

 

     $('.delete_news_button').click(function() {
     var id = document.getElementsByClassName(news_id);

        $('#delete_id_'+id).append(id);
     });

[trq]

if your using jQuery, stick with it.

 

$('.delete_news_button').click(function() {
  var id = $('.news_id').val();
  $('#delete_id_'+id).append(id);
});

 

It's hard to give a working example without knowing what the news_id element your trying to refer to actually is. The above assumes it's an input of some type.

[Andy11548]

Pretty much, for all the new topics that get placed on the homepage, it creates a form accordingly:

 

<div id="delete_id_'.$newsF['id'].'"></div>
               <form name="news_delete" action="" onsubmit="return false">
                  <input type="hidden" class="news_id" value="'.$newsF['id'].'" />
                  <input type="submit" class="delete_news_button" value="Delete '.$newsF['id'].'" />
               </form></div><br />

 

Each of the Hidden Id's have a value, according to the News_ID. They way you said, I've tried already, but it only works for the top one, not for all of them.

 

I need it to get each ID from the same class value.

[trq]

What are you trying to do? And please, post completed markup, not php.

[Andy11548]

Right, example:

 

<input type="hidden" value="3" class="news_id" />
<input type="hidden" value="7" class="news_id" />
<input type="hidden" value="8" class="news_id" />

 

I want to get each of the ID's from the input fields and put them into a div tag where the hidden ID is the same as the Div ID:

 

<div id="delete_news_3">3</div>
<div id="delete_news_7">7</div>
<div id="delete_news_8">8</div>

 

The Javascript code I'm using is:

 

     $('.delete_news_button').click(function() {
           var id = $('.news_id').val();

           $('#delete_id_'+id).append(id);
     });

 

But, when I click the button "delete" it only does shows the ID appended in the top div tag (<div id="delete_news_3"></div>).

[trq]

append appends a child to a parent. You would need to put all your divs in a wrapper and append your new div (which your not currently creating) to that.

 

<div id="stage">
  <div id="delete_news_3">3</div>
  <div id="delete_news_7">7</div>
  <div id="delete_news_8">8</div>
</div>

 

Then:

 

$('.delete_news_button').click(function() {
  $('.news_id').each(function() { // loop through each news_id form element
    var id = $(this).val(); // get the current id
    var div = $('<div />'); // this creates a new div
    div.attr('id', id); // assign the id to the new array
    $('stage').append(div); // append to the stage wrapper.
  });
});