Jquery FADE in/out CONTENT

I needed a bit of help

My problem is I need a Fade in Fade out function that keeps repeating my Div Content about every 7 seconds. Content 1 will appear, then Content 2 will fade in, then Content 3 fade in after content 2 fades out, and it keeps repeating.

I wrote a script but it seems to not working properly. What am I doing wrong? How can I make this more efficient? Any guide will be helpful.

THE HTML inside of a UL wrapped in LIs

<ul>
     <li class=”thecontent”> CONTENT 1</li>
     <li class=”thecontent”> CONTENT 2</li>
     <li class=”thecontent” > CONTENT 3</li>
     <li class=”thecontent” > CONTENT 4</li>
  <ul>

THE CSS

ul li.thecontent{ display:none;}

THE JQUERY

  $(document).load(function(){
     function fadeMyContent() {
     $(".content:hidden:first").fadeIn(700).delay(1000).fadeOut(700,
 function() {    $(this).appendTo($(this).parent());   
 fadeMyContent();    });
       }
     fadeMyContent();

Here you go. In your code the class name in the selector is wrong and also the double quotes enclosing the class names in the markup is not correct.

Working demo

$(function(){
     function fadeMyContent() {

         $(".thecontent:first").fadeIn(700).delay(1000).fadeOut(700,
             function() {    
                     $(this).appendTo($(this).parent());   
                     fadeMyContent();    
             });
      }
     fadeMyContent();
});

Mark up

<ul>
     <li class='thecontent'> CONTENT 1</li>
     <li class='thecontent'> CONTENT 2</li>
     <li class='thecontent'> CONTENT 3</li>
     <li class='thecontent'> CONTENT 4</li>
<ul

Are you calling the correct class?

.content in the jQuery code and "thecontent" in the markup. How exactly is it not working properly? Is the timer not working is it fading too fast, not showing anything at all?

luckily this is what i am working on right now lol

$(document).ready(function(){
    $('.clicked').click(function(){
        $(this).next('.nextSibling').toggle('slow');
    }); 
});