¿Cómo puedo recorrer cada elemento de la lista en cada columna?

Los datos de los elementos de la lista están en bucle, pero no he podido realizar el bucle de cada elemento de la lista de col-md-4 individual.

import React, { Component } from 'react';
import './App.css';
import 'bootstrap/dist/css/bootstrap.min.css';

class App extends Component {
  render() {
    let countries = [
      { name: "Bangladesh", capital: "Dhaka" },
      { name: "Belgium", capital: "Brussels" },
      { name: "France", capital: "Paris" },
      { name: "Greece", capital: "Athens" }
    ];

    return (
      <div className="App">

            <div className="row">
              <div className="col-md-4">
                <ul>
                  {countries.map(country => (
                    <li>
                      Capital of {country.name} is {country.capital};
                   </li>
                  ))}
                </ul>
              </div>

            </div>


      </div>
    );
  }
}

export default App;