Mega Code Archive

 
Categories / JavaScript Tutorial / JQuery
 

Map function and switch

< html>   <head>     <script type='text/javascript' src='js/jquery-1.3.2.js'></script>     <script type='text/javascript'> $(document).ready(   function() {     var $mapped = $('li').map(       function($key) {         switch (true) {           case ($(this).hasClass('my2')): {             return $(this).text() + " <i>C</i>";           }           case ($(this).hasClass('my3')): {             return $(this).text() + " <i>B</i>";              }           case ($(this).hasClass('my')): {             return $(this).text() + " <i>my Harrison</i>";              }         }       }     );     $('ul#ulId').hide();          $($mapped).each(       function() {         $('ul#tmpMapped').append("<li>" + this + "</li>\n");         }     );   } );     </script>     <style type='text/css'> ul {     list-style: none;     margin: 5px;     padding: 0; } ul li {     position: relative;     background: #eff557;     border: 1px solid black;     padding: 3px;     margin: 2px 0; } i {     position: absolute;     top: 3px;     right: 3px; }     </style>   </head>   <body>      <ul id='ulId'>        <li class='my3'>A</li>        <li class='my2'>B</li>        <li class='my3'>C</li>        <li class='my2'>D</li>        <li class='my'>E</li>      </ul>      <ul id='tmpMapped'>      </ul>   </body> </html>