JQuery - Check if next element of DOM has some classname

Question

Hi. Ive this code :

<div class="content">       
    <div class="tlcontent"> 
        <div class="sideon" id="sideline0"> 
            somethings
        </div>

        <div class="trackon" id="trackline0">
            somethings
        </div>

        <div class="sideon" id="sideline1"> 
            somethings
        </div>

        <div class="sideon" id="sideline2">
            somethings
        </div>
    </div>
</div>

i need a function that check the next element in the dom and get the classname. For example, if i get sideline0, the function will return "trackon" (classname of the next element). If i get sideline1, it must return "sideone" and so on..

any idea? cheers

Answer 1

Using #sideline0 as the example element, this should get you the class value of the next DOM element:

$('#sideline0').next().attr('class')

Answer 2

You can use next() and attr like this:

alert($('selector').next().attr('class'));

Since you have not mentioned an event, here is sample code for click event of those divs (you can modify as per your needs):

$('.tlcontent > div').click(function(){
  alert($(this).next().attr('class'));
});

Answer 3

It's hard to tell for your specific example because your code is hidden (put 4 spaces before each line so the software reads it as code). However, in general, you can get the classname of the next DOM element as follows:

var className = $('#sideline0').next().attr('class');

Answer 4

USE

$('#sideline0').next().attr('class');

here is a working example http://jsfiddle.net/yCqkC/