JSFiddle - React, Tailwind, and code Playground

by james gotsell

HTML

<body>
      <div id="app">
          <h3>Blog Post App</h3>
           </br>
        <ul>
            <li v-for="post in posts | limit 10">
                <!-- i need to create a link to the post -->
                {{ post.id }}
            <h4>Blog title</h4>
             <h5><span class="title">{{ post.title }}</span></h5>
                
                <span class='blog_body' track-by='$index'> {{ post.body }}</span>
                <br/>
                
                <button class="show" v-on:click="show()">Show me the blog</button>
                
                <button class="hide" v-on:click="hide()">hide the blog</button>

                <button class="toogle" v-on:click="toggle()">toggle</button>

                <button class="toogle1" v-on:click="toggle1($index)">toggle1</button>

            </li>
        </ul>
    </div>

JavaScript

$('.blog_body')[$index].toggle();